简单说明
forEach
作为数组的一个遍历方法,提供了数组的遍历和值的修改功能。
但是在修改
原数组方面,有不少注意事项。
forEach有两个参数,
第一个参数是回调函数,第二个参数是用来改变this指向的。
第二个参数极少使用,本篇不做介绍。
回调函数可以写入3
个参数,分别是:
item
数组的每个值index
数组的下标arr
数组
forEach
没有返回值,或者说返回值是undefined
const arr = [1, 2, 3]
const arr1 = arr.forEach(item => {
item += 1
})
console.log('arr1: ', arr1)
// arr1: undefined
修改原数组?
这里举几个比较直观的例子,
示例1:
const arr = [1, 2, 3]
arr.forEach(item => {
item += 1
})
console.log(arr) // [1, 2, 3]
示例二:
const arr = [1, 2, 3]
arr.forEach((item, index, arr) => {
arr[index] = item + 1
})
console.log(arr) // [2, 3, 4]
示例三:
const arr = [
{name: 'dilireba', age: 18}
]
arr.forEach(item => {
item = {name: '张三', age: 20}
})
console.log(arr) // [{name: 'dilireba', age: 18}]
示例四:
const arr = [
{name: 'dilireba', age: 18}
]
arr.forEach(item => {
item.name = '张三'
item.age = 20
})
console.log(arr) // [{name: '张三', age: 20}]
示例5:
const arr = [
{name: 'dilireba', age: 18}
]
arr.forEach((item, index, arr) => {
arr[index] = {name: '张三', age: 20}
})
console.log(arr) // [{name: '张三', age: 20}]
总结
如果实在想用forEach
修改原数组值,不要直接在item
上去改,
而是借助于回调函数的第三个参数去修改。
中断遍历
forEach
无法中断遍历
const arr = [1, 2, 3]
arr.forEach(item => {
if(item === 2) {
return false
}
console.log(item)
})
// 1 3
在中间已经返回false
的情况下,依然会继续遍历,知道遍历完所有的值。
如果非要中断,可以抛出错误,throw Error('不满足条件,中断遍历')
但是这种情况一般用array的every
或者some
方法。