javascript map详解

map()

• 不会对空数组进行遍历

   let arr = []
        let newArr = arr.map((item, i, arr) => {
            //item:遍历数组的每一项，i:数组当前项的下标，arr原数组
            console.log(`item---${item}, i---${i}, arr---${arr}`)
            return item + i
        })
        console.log(newArr) //[]

image.png

**函数内console没有执行，证明数组为空是并不执行遍历

• 返回一个新数组，长度等于原数组长度

   let arr = [1, 2, 3]
        let newArr = arr.map((item, i, arr) => {
            //item:遍历数组的每一项，i:数组当前项的下标，arr原数组
            console.log(`item---${item}, i---${i}, arr---${arr}`)
            return item + i
        })
        console.log(newArr) //[undefined, undefined, undefined]

image.png

**即便函数返回空 结果数组的长度和原数组是一致的

• 不会改变原数组

 let arr = [1, 2, 3]
        let newArr = arr.map((item, i, arr) => {
            //item:遍历数组的每一项，i:数组当前项的下标，arr原数组
            console.log(`item---${item}, i---${i}, arr---${arr}`)
            return item + i
        })
        console.log(newArr,arr) //[1, 3, 5]

image.png

• map() 参数必须是函数

        let arr = [1, 2, 3]
        let obj = {
            1: 2
        }
        let arr1 = [1, 2]
        let str = 123
        // let newArr = arr.map(obj)
        let newArr1 = arr.map(arr1)
        let newArr2 = arr.map(str)

image.png

• 函数接收三个参数
  1. item (必须) 当前遍历项
  2. i （非必须）当前遍历项下标
  3. arr (非必须) 原数组

完整demo

        let arr = [1, 2, 3]
        let newArr = arr.map((item, i, arr) => {
            //item:遍历数组的每一项，i:数组当前项的下标，arr原数组
            console.log(`item---${item}, i---${i}, arr---${arr}`)
            return item + i
        })
        console.log(newArr) //[1, 3, 5]

image.png

您的点赞是我的动力 谢谢！