js中对数组进行遍历都有哪些方法_js遍历json对象

遍历有如下几种方式

数组方法

map

forEach

filter

find

findIndex

every

some

reduce

reduceRight

其他方法

for

for in

for of

数组方法

map

核心

创建一个新数组，其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。

不改变原数组

返回值是一个新的数组

let testArr = [‘子项0′,’子项1′,’子项2’];

let resultArr= testArr.map((item, index) =>{return`处理·${item}`

});

console.log(resultArr);//结果： [“处理·子项0”, “处理·子项1”, “处理·子项2”]

缺陷

可以使用return，但是不能使用break和continue

forEach

核心

对数组的每个元素执行一次提供的函数。

总是返回undefined。

不改变原数组

let testArr = [‘子项0′,’子项1′,’子项2’];

testArr.forEach((item, index)=>{return`forEach处理${item}`

});

缺陷

可以使用return，但是不能使用break和continue

filter

核心

对数组的每一项都进行过滤，返回符合条件的item组成的数组

不会改变原数组

let filterArr = [‘子项0′,’子项1′,’子项2’];

let filterResult= filterArr.filter((item, index) =>{return item === ‘子项0’;

});

console.log(filterArr);//[“子项0”, “子项1”, “子项2”]

console.log(filterResult); [“子项0”]

缺陷

可以使用return，但是不能使用break和continue

find

核心

遍历数组，找到第一个符合条件的项，并返回该项。否则返回undefined

不会改变数组

let findArr = [‘子项0′,’子项1′,’子项2’]

let findResult= findArr.find((item, index) =>{return item === ‘子项0’;

});

console.log(findResult);//结果为: 子项0

缺陷

可以使用return，但是不能使用break和continue

findIndex

核心

遍历数组找到第一个符合条件的项，并返回该项的索引值。否则返回-1。

不会改变数组对象。

let findIndexArr = [‘子项0′,’子项1′,’子项2’];

let findIndexResult= findIndexArr.findIndex((item, index)=>{return item === ‘子项0’;

});

console.log(findIndexResult);//结果为： true

缺陷

可以使用return，但是不能使用break和continue

every

核心

对数组中的每一项运行给定函数，如果该函数对每一项返回true,则返回true。简单说就是看数组的每个元素是否符合要求，都符合则返回true，否则返回false

let everyArr = [2,3,4];

let everyResult= everyArr.every((item, index)=>{return item > 0});

console.log(everyResult);//结果为: true

缺陷

可以使用return，但是不能使用break和continue

some

是对数组中每一项运行指定函数，如果该函数对任一项返回true，则返回true。

let someArr = [2,3,4];

let someResult= someArr.some((item, index)=>{return item > 3});

console.log(someResult);//结果为: true

缺陷

可以使用return，但是不能使用break和continue

reduce

接收一个函数作为累加器(accumulator)，数组中的每个值(从左到右)开始缩减，最终为一个值。

第二个参数作为第一次调用的a的值

//reducer

let reduceArr = [0,1,2,3,4]

let reduceResult= reduceArr.reduce((a, b)=>{return a +b;

});

console.log(reduceResult);//结果: 10

缺陷

可以使用return，但是不能使用break和continue

reduceRight

和reduce一样是累加器，不过是从右往左计算

第二个参数作为第一次调用的a的值

let reduceRightArr = [0,1,2,3,4]

let reduceRightResult= reduceRightArr.reduceRight((a, b)=>{return a +b;

});

console.log(reduceRightResult);//结果: 10

缺陷

可以使用return，但是不能使用break和continue

其他方法

for循环

核心

使用临时变量，并且遍历的是key.

let testArr = [‘子项0′,’子项1′,’子项2’];for(var i = 0; a < testArr.length; i++){

console.log(testArr[i]);

}

缺陷

可以正常使用使用break和continue, 但是不能正常使用return

let testArr = [‘子项0′,’子项1′,’子项2’];//break

for(var i = 0; i < testArr.length; i++) {if(i === 1) {break;

}

console.log(testArr[i]);

}//结果为： 子项0

//continue

for(var i = 0; i < testArr.length; i++) {if(i === 1) {continue;

}

console.log(testArr[i]);

}//结果为: 子项0 子项目2

//return

for(var i = 0; i < testArr.length; i++) {if(i === 1) {return;

}

console.log(testArr[i]);

}//结果为什么也没有

for in循环

核心

遍历的是key

let testArr = [‘子项0′,’子项1′,’子项2’];for(let i intestArr){

console.log(testArr[i])

}

缺陷

可以正常使用使用break和continue, 但是不能正常使用return

let testArr = [‘子项0′,’子项1′,’子项2’];//break

for(let i intestArr){if(i === 1) {break;

}

console.log(testArr[i]);

}//结果为： 子项0

//continue

for(let i intestArr){if(i === 1) {continue;

}

console.log(testArr[i]);

}//结果为: 子项0 子项目2

//return

for(let i intestArr){if(i === 1) {return;

}

console.log(testArr[i]);

}//结果为什么也没有

for of循环

核心

遍历的是value

let testArr = [‘子项0′,’子项1′,’子项2’];for(let i of testArr) {

console.log(i);

}

缺陷

可以正常使用使用break和continue, 但是不能正常使用return

let testArr = [‘子项0′,’子项1′,’子项2’];//break

for(let value of testArr){if(value === ‘子项1’){break;

}

console.log(value);

}//结果为： 子项0

//continue

for(let value of testArr){if(value === ‘子项1’){continue;

}

console.log(value);

}//结果为: 子项0 子项目2

//return

for(let value of testArr){if(value === ‘子项1’){return;

}

console.log(value);

}//结果为什么也没有

注意⚠️

数组方法都不可以用break和continue，for循环之类的不可以用return但是可以正常使用break和continue