forEach 和 map

二者都是用来遍历数组的每一项,二者都不会通过处理遍历项 直接改变原数组

1. forEach

没有返回值,三个参数(数组项,下标,索引数组)

可以通过改变 索引数组 或者 原数组 来更改数组,索引数组就是原数组的地址,可以通过改变它去改变原数组

var arr = [1,2,3,4,5]
arr.forEach((item, index, tempArr) => {
    
    
	tempArr[index] = item*10 // 等同于 arr[index] = item*10
})
console.log(arr)  // Array(5) [ 10, 20, 30, 40, 50 ]

2. map

返回一个新数组,是回调函数返回值的集合。
参数与 forEach 相同

var arr = [1,2,3,4,5]
let newArr = arr.map((item, index, tempArr) => {
    
    
	return item*10 // 返回值会组成一个新数组
})
console.log(newArr)  // Array(5) [ 10, 20, 30, 40, 50 ]

你也可以通过改变原数组的每一项 或者 索引数组 来更改原数组

注意

forEachmap 中,二者都不可以使用 break 和 continue 来跳过或者结束循环。
但是可以使用 return 来跳过当前循环

        var arr = [1,2,3,4,5]
        let newArr = arr.map((item, index, tempArr) => {
    
    
            if (index == 3) {
    
     
                return
            } else {
    
    
                return item*10
            }
        })
        newArr  //Array(5) [ 10, 20, 30, undefined, 50 ]

上面使用了 map 循环, forEach 同样也可以使用此方法
你还可以通过加上 filter 方法来去除数组空位或者未定义的数组项,非常实用

		var arr = [1,2,3,4,5]
        let newArr = arr.map((item, index, tempArr) => {
    
    
            if (index == 3) {
    
     
                return
            } else {
    
    
                return item*10
            }
        }).filter(item => item)
        newArr // Array(4) [ 10, 20, 30, 50 ]

猜你喜欢

转载自blog.csdn.net/pspxuan/article/details/106876707