日常使用中,请求回的数据大都是数组格式,需要进行处理,使用数组方法,主要的数组方法有以下几种:
案例演示的初始数组:
var arr = [1,2,3,4]
1、前增:unshift('新增元素') 在数组开头添加一个元素,返回值为新数组的长度
arr.unshift(5)
console.log(arr)
2、后增:push('新增元素')在数组最后添加一个元素,返回新数组长度
arr.push('后增')
console.log(arr)
3、前删:shift()删除数组中的首个元素,返回被删除的元素
var x = arr.shift()
console.log(arr)
console.log('删除:' + x)
4、后删:pop()删除数组的末尾元素,返回被删除的元素
arr.pop()
console.log(arr)
console.log('删除:'+ arr.pop())
5、合并数组:concat()方法通过合并(连接)现有数组来创建一个新数组,不改变现有数组返回一个新数组
var arr = [1, 2, 3, 4]
var arr2 = ['一', '二', '三']
console.log(arr.concat(arr2))
6、join()将数组的每一项用指定字符连接形成一个字符串。默认连接字符为 “,” 逗号。原数组不变
var arr = [1, 2, 3, 4]
console.log(arr.join('/'))
7、reverse(),将数组倒序。原数组改变。
var arr = [1, 2, 3, 4]
var arr2 = arr.reverse()
console.log('原数组' + arr)
console.log('倒序' + arr2)
8、截取slice('参数1’,'参数2'),接收两个参数为数组的索引,第一个参数表示开始的位置,第二个参数表示结束的位置。截取出的数组包含参数1指向的元素,不包含结束位置。若不指定第二个参数则截取起始位置到末尾所有元素,参数可以为负数,为负数时从末尾向首位截取。返回一个新的数组,不改变原数组
var arr = [1, 2, 3, 4]
var arr2 = arr.slice(1)//从下标为1的元素截取至末尾元素
var arr3 = arr.slice(0,2)//从下标为0的元素开始截取到下标为3的元素(不包含下标为3)
var arr4 = arr.slice(-2)//从右向左截取
console.log('原数组' + arr)
console.log('一个参数' + arr2)
console.log('二个参数' + arr3)
console.log('参数为负数' + arr4)
9、forEch((参数1,参数2)=>{ })遍历数组,遍历数组的每一项。参数为一个回调函数
var arr = [1, 2, 3, 4]
var arr2 = []
var arr3 = []
arr.forEach((item, index) => {
arr2.push(item)//回调参数一为数组的每一项元素
arr3.push(index)//参数二为索引值
})
console.log(arr2)
console.log(arr3)
10、map(()=>{})遍历数组
map
方法用于对数组中的每个元素执行一个提供的函数,并返回一个新的数组,新数组的元素是回调函数的返回值。map
会遍历数组的每个元素,并将每个元素传递给回调函数进行处理,并将回调函数的返回值作为新数组的元素。- 回调函数接受三个参数:当前遍历的元素、当前遍历的索引和原始数组本身。
map
方法不会修改原始数组,而是返回一个新的数组,该数组包含了回调函数的返回值
const array = [1, 2, 3];
const newArray = array.map((element, index, array) => {
return element * 2;
});
console.log(newArray); // 输出 [2, 4, 6]
11、filter(()=>{}),过滤数组中,符合条件的元素并返回一个新的数组。
12、every(function),对数组中的每一项进行判断,若都符合则返回true,否则返回false。
13、some(function),对数组中的每一项进行判断,若都不符合则返回false,否则返回true。
14、indexOf()检测当前值在数组中第一次出现的位置索引参数:array.indexOf(item,start) item:查找的元素 start:字符串中开始检索的位置。返回值:第一次查到的索引,未找到返回-1。不改变原数组
15,includes()判断一个数组是否包含一个指定的值,参数:指定的内容返回值:布尔值是否改变原数组:不改变。
ES6部分方法
1、find(function)
方法,用于找出第一个符合条件的数组成员。返回值:符合条件的数组元素,如果没有符合条件的成员,则返回undefined
。
[1, 5, 10, 15].find(function(value, index, arr) {
return value > 9;
}) // 10
2、findIndex()
方法的用法与find()
方法非常类似,返回第一个符合条件的数组成员的位置,如果所有成员都不符合条件,则返回-1
[1, 5, 10, 15].findIndex(function(value, index, arr) {
return value > 9;
}) // 2
3、flat()扁平化数组,可以扁平化数组,接受一个整数参数,指定要拉平几层
[1, 2, [3, [4, 5]]].flat()//默认拉平一层
// [1, 2, 3, [4, 5]]
[1, 2, [3, [4, 5]]].flat(2)//拉平2层嵌套
// [1, 2, 3, 4, 5]
以上为个人总结归纳基础常用之方法,错误之处请大家批评指正,整理不易,内容满意麻烦点个赞!