数组遍历方法
1.forEach
提供回调函数的方法,处理数组的每一个元素,对数组中的每个元素执行一次回调函数,遍历索引和数组本身,默认没有返回值。
const arr = ['red', 'blue', 'yellow'];
arr.forEach((item, index) => {
console.log(item, index)
});
// 输出
//'red',0
//'blue',1
//'yellow',2
2.map
元素数组映射,创建一个新的映射数组(跟forEach的差别),不改变原始数组
const arr = [1,2,3];
const newArr = arr.map((item,index)=>{
return item+index;
});
console.log(newArr)
// 输出 [1,3,5]
3.for循环
最简单常用的数组遍历方法之一,按索引顺序遍历数组元素
const arr = [1,2,3];
for(let i = 0;i < arr.length;i++){
console.log(arr[i])
}
// 输出
// 1
// 2
// 3
4.for...of循环
ES6新增的一个循环语法,直接遍历数组中的所有元素,不需要索引
const arr = [1,2,3];
for(let item of arr){
console.log(item);
}
// 输出
// 1
// 2
// 3
5.for...in循环
一般对对象使用,如果对数组Array使用,则它的元素索引被视为一个属性,此方法遍历出来的是字符串
var arr = ['A','B','C'];
arr.name = 'D';
for(var item in arr){
console.log(x)
}
// 输出
// '0'
// '1'
// '2'
// 'D'
6.filter
用于筛选数组中满足指定条件的元素,返回一个新的数组(不会修改原始数组),新数组包含符合筛选条件的元素
const arr = [1,2,3];
let newArr = arr.filter((item)=>{
return item >=2;
});
console.log(newArr);
// 输出
// [2,3]
7.reduce
对数组中元素进行累积操作的方法,一般用于求和,通过提供的回调函数进行累积操作
const arr = [1,2,3];
let sum = arr.reduce((total,item)=>{
return total + item;
});
console.log(sum);
// 输出
// 6
8.every方法
用于判断数组中的元素是否每一项都满足条件,所有项满足才会返回true,否则返回false
const arr = [1,2,3,4];
const arrBlow = arr.every((item)=>{
return item > 2
});
console.log(arrBlow);
// 输出
// false
9.some
用于判断数组中是否有某一项满足条件,只要有某一项满足则返回true,全部都不满足则返回false
const arr = [1,2,3,4];
const arrBlow = arr.some((item)=>{
return item > 2
});
console.log(arrBlow);
// 输出
// true
10.find
遍历数组,找返回满足条件的第一项元素,如果整个数组都没有满足条件的元素,则返回undefined
const arr = [
{ name:'tony', age:18 },
{ name:'mark', age:20 },
{ name:'jane', age:22 },
];
const result = arr.find((item)=>{
return item.age > 18
});
console.log(result);
// 输出
// { name:'mark', age:20 }
11.findIndex
操作数组方法
遍历数组,找返回满足条件的第一项元素,返回该元素的索引,如果没有满足的则返回-1
const arr = [
{ name:'tony', age:18 },
{ name:'mark', age:20 },
{ name:'jane', age:22 },
];
const result = arr.find((item)=>{
return item.age > 18
});
console.log(result);
// 输出
// 1
1.push
直接对数组进行操作,将一个或者多个数据添加到数组的尾部;返回添加后的数组的长度
let arr = ['A','B','C'];
let newLength = arr.push('D','E');
console.log(arr);
// 输出
// ['A','B','C','D','E'];
console.log(newLength);
// 输出
// 5
2.unshift
直接对数组进行操作,将一个或者多个数据添加到数组的头部;返回添加后的数组的长度
let arr = ['A','B','C'];
let newLength = arr.unshift('D','E');
console.log(arr);
// 输出
// ['D','E','A','B','C'];
console.log(newLength);
// 输出
// 5
3.pop
直接对数组进行操作,删除数组的最后一个元素;返回被删除的元素
let arr = ['A','B','C'];
let lastData = arr.pop();
console.log(arr);
// 输出
// ['A','B'];
console.log(lastData);
// 输出
// C
4.shift
直接对数组进行操作,删除数组的第一个元素;返回被删除的元素
let arr = ['A','B','C'];
let firstData = arr.shift();
console.log(arr);
// 输出
// ['B','C'];
console.log(firstData);
// 输出
// A
5.slice
选择数组的一部分,返回一个新数组,不改变原数组,从第一个参数对应的索引开始截取,到第二个参数对应的索引结束
let arr = ['A','B','C','D','E'];
let newArr = arr.slice(1,3);
console.log(newArr);
// 输出
// ['B','C']
6.splice
直接修改原数组,通过删除、添加或替换元素直接修改原数组;
// array.splice(index,howmany,item1,...,itemX)
// index: 必需,指定操作的起始位置下标(整数),支持负数(-1表示数组的末尾)
// howmany: 必需,需要删除的元素数量,如果为0或者负数,则直接插入元素
// item1,...,itemX: 可选,需要在删除位置插入的新元素
let arr = ['A','B','C','D','E'];
arr.splice(1,1,'A1','B1');
console .log(arr);
// 输出
// ['A','A1','B1','C','D','E']
7.reverse
直接修改原数组,使数组逆序排列
let arr = ['A','B','C','D'];
arr.reverse();
console.log(arr);
// 输出
// ['D','C','B','A']
8.sort
直接修改原数组,根据传入的函数方法进行排序(默认按字符编码格式升序)
let arr = [4,2,3,1]
arr.sort();
console.log(arr);
// 输出
// [1,2,3,4]
let arr = [4,2,3,1]
arr.sort(function(a,b){
return a - b;
});
console.log(arr);
// 输出
// [1,2,3,4]
let arr = [4,2,3,1]
arr.sort(function(a,b){
return b - a;
});
console.log(arr);
// 输出
// [4,3,2,1]
9.join
返回一个新字符串(不修改原数组),将数组转换成字符串,根据传入的指定分隔符进行分割(默认是逗号)
let arr = [1,2,3];
let newArr = arr.join('-');
console.log(newArr);
// 输出
// '1-2-3'