首页 > 其他分享 >js数组常用方法

js数组常用方法

时间:2024-05-10 17:26:43浏览次数:19  
标签:常用 console log res arr js item 数组

一、改变原数组的方法
        1.push() 末尾添加数据
        2. pop() 末尾出删除数据
        3.unshift() 头部添加数据
        4.shift() 头部删除数据
        5.reverse() 翻转数组
        6.sort() 排序
        7.splice()  截取数组
    二、不改变原数组的方法
        1.concat()  合并数组
        2.join() 数组转字符串
        3.slice()截取数组的一部分数据
        4.indexOf 从左检查数组中有没有这个数值
        5.lastIndexOf 从右检查数组中有没有这个数值
    三、ES6新增的数组方法
        1. forEach()   用来循环遍历的 for
        2.map  映射数组的
        3.filter  过滤数组
        4.every  判断数组是不是满足所有条件
        5.some() 数组中有没有满足条件的
        6.find()用来获取数组中满足条件的第一个数据
        7.reduce()叠加后的效果       
    总结
一、改变原数组的方法
1.push() 末尾添加数据
    语法: 数组名.push(数据)
    作用: 就是往数组末尾添加数据
    返回值: 就是这个数组的长度
//push
var arr = [10, 20, 30, 40]
res = arr.push(20)
console.log(arr);//[10,20,30,40,20]
console.log(res);//5
2. pop() 末尾出删除数据
    语法:数组名.pop()
    作用: 就是从数组的末尾删除一个数据
    返回值: 就是你删除的那个数据
//pop
var arr = [10, 20, 30, 40]
res =arr.pop()
console.log(arr);//[10,20,30]
console.log(res);//40
3.unshift() 头部添加数据
    语法: 数组名.unshift(数据)
    作用: 就是在数组的头部添加数据
    返回值: 就是数组的长度
//pop
var arr = [10, 20, 30, 40]
res=arr.unshift(99)
console.log(arr);//[99,10,20,30,40]
console.log(res);//5
4.shift() 头部删除数据
    语法: 数组名.shift()
    作用: 头部删除一个数据
    返回值: 就是删除掉的那个数据
//shift
 var arr = [10, 20, 30, 40]
 res=arr.shift()
 console.log(arr);[20,30,40]
 console.log(res);10
5.reverse() 翻转数组
    语法: 数组名.reverse()
    作用: 就是用来翻转数组的
    返回值: 就是翻转好的数组
//reverse
var arr = [10, 20, 30, 40]
res=arr.reverse()
console.log(arr);//[40,30,20,10]
console.log(res);//[40,30,20,10]
6.sort() 排序
    语法一: 数组名.sort()                       会排序 会按照位排序
    语法二: 数组名.sort(function (a,b) {return a-b})  会正序排列
    语法三: 数组名.sort(function (a,b) {return b-a})  会倒序排列
//sort()
var arr = [2, 63, 48, 5, 4, 75, 69, 11, 23]
arr.sort()
console.log(arr);
arr.sort(function(a,b){return(a-b)})
console.log(arr);
arr.sort(function(a,b){return(b-a)})
console.log(arr);
7.splice()  截取数组
    语法一: 数组名.splice(开始索引,多少个)
    作用: 就是用来截取数组的
    返回值: 是一个新数组 里面就是你截取出来的数据
    语法二: 数组名.splice(开始索引,多少个,你要插入的数据)
    作用: 删除并插入数据
    注意: 从你的开始索引起
    返回值: 是一个新数组 里面就是你截取出来的数据
//splice() 语法一
var arr = [2, 63, 48, 5, 4, 75]
res = arr.splice(1,2)
console.log(arr);
console.log(res);
//******************************
//splice() 语法二
var arr = [2, 63, 48, 5, 4, 75]
res = arr.splice(1,1,99999,88888)
console.log(arr);
console.log(res);
二、不改变原数组的方法
1.concat()  合并数组
    语法: 数组名.concat(数据)
    作用: 合并数组的
    返回值: 一个新的数组
//concat
var arr = [10, 20, 10, 30, 40, 50, 60]
res = arr.concat(20,"小敏",50)
console.log(arr)
console.log(res);
2.join() 数组转字符串
    语法:数组名.join('连接符')
    作用: 就是把一个数组转成字符串
    返回值: 就是转好的一个字符串
//join
var arr = [10, 20, 10, 30, 40, 50, 60]
res = arr.join("+")
console.log(arr)
console.log(res);
3.slice()截取数组的一部分数据
    语法: 数组名.slice(开始索引,结束索引)
    作用: 就是截取数组中的一部分数据
    返回值: 就是截取出来的数据 放到一个新的数组中
    注意: 包前不好后 包含开始索引不包含结束索引
//slice
var arr = [10, 20, 10, 30, 40, 50, 60]
res = arr.slice(1,4)
console.log(arr)
console.log(res);
4.indexOf 从左检查数组中有没有这个数值
    语法一:数组名.indexOf(要查询的数据)
    作用: 就是检查这个数组中有没有该数据
    如果有就返回该数据第一次出现的索引
    如果没有返回 -1
    语法二:数组名.indexOf(要查询的数据,开始索引)
//indexOf 语法一
var arr = [10, 20, 10, 30, 40, 50, 60]
res = arr.indexOf(10)
console.log(arr)
console.log(res);
//*************************************
//indexOf  语法二
var arr = [10, 20, 10, 30, 40, 50, 60]
res = arr.indexOf(10,1)
console.log(arr)
console.log(res);
5.lastIndexOf 从右检查数组中有没有这个数值
    语法一:数组名.indexOf(要查询的数据)
    作用: 就是检查这个数组中有没有该数据
    如果有就返回该数据第一次出现的索引
    如果没有返回 -1
    语法二:数组名.lastIndexOf(要查询的数据,开始索引)
//lastIndexOf 语法一
var arr = [10, 20, 10, 30, 40, 50, 60]
res = arr.lastIndexOf(50)
console.log(arr)
console.log(res);
//*************************************
//lastIndexOf 语法二
var arr = [10, 20, 10, 30, 40, 50, 60]
res = arr.lastIndexOf(50,4)
console.log(arr)
console.log(res);
三、ES6新增的数组方法
1. forEach()   用来循环遍历的 for
    语法: 数组名.forEach(function (item,index,arr) {})
     + item : 这个表示的是数组中的每一项
     + index : 这个表示的是每一项对应的索引
     + arr : 这个表示的是原数组
    作用: 就是用来循环遍历数组的 代替了我们的for
    返回值: 没有返回值 如果真的说要有返回值就是undefined
//forEach
var arr = [1, 2, 3, 4, 5]
console.log('原始数组 : ', arr);
var res = arr.forEach(function (item, index, arr) {
    console.log(item, "------", index, "-------", arr);
})
2.map  映射数组的
    语法: 数组名.map(function (item,index,arr) {})
    + item : 这个表示的是数组中的每一项
    + index : 这个表示的是每一项对应的索引
    + arr : 这个表示的是原数组
    作用: 就是用来映射
    返回值: 必然是一个数组 一个映射完毕的数组;这个数组合原数组长度一样
    注意: 要以return的形式执行返回条件
//map
var arr = [1, 2, 3, 4, 5]
console.log('原始数组 : ', arr);
var res = arr.map(function (item) {
    return item*1000
})
console.log(res);
3.filter  过滤数组
    语法: 数组名.filter(function (item,index,arr) {})
     + item : 这个表示的是数组中的每一项
     + index : 这个表示的是每一项对应的索引
     + arr : 这个表示的是原数组
    作用: 用来过滤数组的
    返回值: 如果有就是过滤(筛选)出来的数据 保存在一个数组中;如果没有返回一个空数组
    注意: 要以return的形式执行返回条件
//filter
var arr = [1, 2, 3, 4, 5]
console.log('原始数组 : ', arr);
var res = arr.filter(function (item) {
    return item > 2
})
console.log(res);
4.every  判断数组是不是满足所有条件
    语法: 数组名.every(function (item,index,arr) {})
    + item : 这个表示的是数组中的每一项
    + index : 这个表示的是每一项对应的索引
    + arr : 这个表示的是原数组
    作用: 主要是用来判断数组中是不是 每一个 都满足条件
         只有所有的都满足条件返回的是true
         只要有一个不满足返回的就是false
    返回值: 是一个布尔值
    注意: 要以return的形式执行返回条件
//every
var arr = [1, 2, 3, 4, 5]
console.log('原始数组 : ', arr);
var res = arr.every(function (item) {
    return item > 0
})
console.log(res);//打印结果  true
5.some() 数组中有没有满足条件的
    语法: 数组名.some(function (item,index,arr) {})
    + item : 这个表示的是数组中的每一项
    + index : 这个表示的是每一项对应的索引
    + arr : 这个表示的是原数组
    作用: 主要是用来判断数组中是不是 每一个 都满足条件
         只有有一个满足条件返回的是true
         只要都不满足返回的就是false
    返回值: 是一个布尔值
    注意: 要以return的形式执行返回条件
//some
var arr = [1, 2, 3, 4, 5]
console.log('原始数组 : ', arr);
var res = arr.some(function (item) {
    return item > 3
})
console.log(res);//true
6.find()用来获取数组中满足条件的第一个数据
    语法: 数组名.find(function (item,index,arr) {})
    + item : 这个表示的是数组中的每一项
    + index : 这个表示的是每一项对应的索引
    + arr : 这个表示的是原数组
    作用: 用来获取数组中满足条件的数据
    返回值: 如果有 就是满足条件的第一个数据;如果没有就是undefined
    注意: 要以return的形式执行返回条件
//find
var arr = [1, 2, 3, 4, 5]
console.log('原始数组 : ', arr);
var res = arr.find(function (item) {
    return item > 3
})
console.log(res)//4
7.reduce()叠加后的效果      
    语法: 数组名.reduce(function (prev,item,index,arr) {},初始值)
    + prev :一开始就是初始值 当第一次有了结果以后;这个值就是第一次的结果
    + item : 这个表示的是数组中的每一项
    + index : 这个表示的是每一项对应的索引
    + arr : 这个表示的是原数组
    作用: 就是用来叠加的
    返回值: 就是叠加后的结果
    注意: 以return的形式书写返回条件
//reduce
var arr = [1, 2, 3, 4, 5]
var res = arr.reduce(function (prev, item) {
    return prev *= item
}, 1)
console.log(res);//120


    JavaScript 删除数组中指定元素
        1.使用splice()方法删除元素
        2.使用filter()方法删除元素
        3.使用pop()和shift()方法删除元素
        4.使用slice()方法删除元素
        5.使用ES6的filter()方法删除元素
    总结
JavaScript 删除数组中指定元素
在 JavaScript 中,数组是一种常见的数据类型,可以存储多个元素。有时候,我们需要从数组中删除某些特定的元素。本文将介绍如何使用 JavaScript 删除数组中指定的元素。
1.使用splice()方法删除元素
JavaScript 中的 splice() 方法可用于在数组中添加或删除元素。如果我们需要删除数组中的元素,可以使用 splice() 方法。该方法接受两个参数,第一个参数指定要删除的元素的位置,第二个参数指定要删除的元素个数。例如,我们可以使用以下代码删除数组中的第二个元素:
let myArray = ["apple", "banana", "orange", "grape"];
myArray.splice(1, 1);
console.log(myArray); // ["apple", "orange", "grape"]
输出结果为:["apple", "orange", "grape"]
2.使用filter()方法删除元素
除了使用 splice() 方法,我们还可以使用 filter() 方法来删除数组中的元素。该方法可用于创建一个新的数组,其中包含符合特定条件的元素。我们可以使用以下代码删除数组中的所有 “banana” 元素:
let myArray = ["apple", "banana", "orange", "grape"];
myArray = myArray.filter(function(item) {
  return item !== "banana"
});
console.log(myArray); // ["apple", "orange", "grape"]
输出结果为:["apple", "orange", "grape"]
3.使用pop()和shift()方法删除元素
pop() 和 shift() 方法可用于删除数组的最后一个元素和第一个元素。如果我们想删除数组中的特定元素,可以使用这些方法与 indexOf() 方法结合使用。例如,以下代码可以删除数组中的第二个元素:
let myArray = ["apple", "banana", "orange", "grape"];
let index = myArray.indexOf("banana");
if (index !== -1) {
  myArray.splice(index, 1);
}
console.log(myArray); // ["apple", "orange", "grape"]
输出结果为:["apple", "orange", "grape"]
4.使用slice()方法删除元素
slice() 方法是一个纯函数,它不会改变原始数组,而是返回一个新的数组,该数组包含从开始到结束(不包含结束)的元素。我们可以使用以下代码删除数组中的第二个元素:
let myArray = ["apple", "banana", "orange", "grape"];
let newArray = myArray.slice(0, 1).concat(myArray.slice(2));
console.log(newArray); //["apple", "orange", "grape"]
输出结果为:["apple", "orange", "grape"]
5.使用ES6的filter()方法删除元素
ES6 中的 filter() 方法也可以用于删除数组中的元素。我们可以使用以下代码删除数组中的所有 “banana” 元素:
let myArray = ["apple", "banana", "orange", "grape"];
myArray = myArray.filter(item => item !== "banana");
console.log(myArray); // ["apple", "orange", "grape"]
输出结果为:["apple", "orange", "grape"]

标签:常用,console,log,res,arr,js,item,数组
From: https://www.cnblogs.com/bwteacher/p/18184882

相关文章

  • os模块常用方法
    os模块是和系统操作有关的模块,在做自动化时,创建或者删除文件或路径、判断是文件还是路径、给文件重命名等,都需要用到这个模块,下面我们罗列了一下os模块常用的方法1、获取当前路径os.getcwd() 2、切换路径os.chdir(r'D:\work')  #路径切换到D:\work r'D:\work'......
  • h5使用js拉起微信支付
    近期,业务需求对接了微信支付,做个总结。web网页想要拉起微信支付,有两种方法:H5下单支付,JSAPI支付。首先纯前端做不了微信支付,必须配合后端才能通过微信的下单请求。接下来说说这两种方法的区别。H5微信下单支付这种支付方式是用户在浏览器端打开网页,通过下单等操作,与后端交互......
  • Json转Go在线工具
    1、可以将Json字符串在线自动解析校验格式化为go的struct结构体(严格按照Golang标准执行生成struct结构体)2、提供将任意复杂,简单格式的Json字符串转换生成go的struct结构体3、支持Json格式错误提示,不会格式化不符合规范的Json字符串,以保证struct结构体的准确性4、支持选择是......
  • Json压缩转义工具
    1,实现在线压缩Json字符串,压缩Json可以减少在传输过程中消耗的流量,提高传输速度2,Json压缩转义功能也很常用,有些Json被转义过的,可以利用此工具进行去除转义,格式化Json3,Json格式化的时候要确保Json在此之前没有被转义过,转义过的Json不会被格式化,需要先去除转义哦免费使用地址:h......
  • Json生成Java实体类工具
    1,贴入json内容,Javabean的类名、包名即可自动生成JavaBean代码,并可以直接打包下载源码2,支持将任意复杂/简单格式的Json字符串生成Javabean实体类3,提供Json格式错误提示,不会格式化不符合规范的Json字符串,确保了Javabean实体类的准确性4,如果你的Json字段包含系统关键字,又不......
  • Xml和Json在线互转工具
    1、支持将Xml数据转为Json字符串格式2、支持将Json字符串转换为Xml格式的数据3、Json转为Xml数据时,提供自动检测Json格式是否正确,确保转换的Xml数据是准确的4、提供详细的Xml数据和Json字符串数据5、提供示例xml和json示例,供大家测试使用免费使用工具地址:http://tools.linu......
  • json在线解析及格式化工具
    JSON可以将程序语言对象中表示的一组数据转换为字符串,然后就可以在网络或者程序之间轻松地传递这个字符串,并在需要的时候将它还原为各编程语言所支持的数据格式,例如在PHP中,可以将JSON还原为数组或者一个基本对象。在用到AJAX时,如果需要用到数组传值,这时就需要用JSON将数组转化......
  • php使用mysql-text字段存取json字符串
    PHP保存时过滤掉双引号&单引号&tabfunctionformartJsonString($jsonString=''){ $jsonString=str_replace("'","",$jsonString); $jsonString=str_replace('\"',"",$jsonString); $jsonString=st......
  • 代码随想录训练营第二天 | 977.有序数组的平方 209.长度最小的子数组 59.螺旋矩阵II
    977.有序数组的平方题目链接:https://leetcode.cn/problems/squares-of-a-sorted-array/文章讲解:https://programmercarl.com/0977.有序数组的平方.html视频讲解:https://www.bilibili.com/video/BV1QB4y1D7ep暴力解时间复杂度O(nlogn)空间复杂度O(1)双指针法时间复......
  • node.js 封装操作文件类
    constfs=require('fs');constpath=require('path');classFile{constructor(fileName,name,ext,isFile,size,createTime,updateTime){this.fileName=fileName;this.name=name;this.ext=ext;......