javascript map详解

淡淡的烟草味﹌ 2022-03-15 10:00 239阅读 0赞

##### 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) //[]
    复制代码

\*\*函数内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]
    复制代码

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

*  不会改变原数组

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]
    复制代码

*  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)
    复制代码

*  函数接收三个参数
    
    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]
    复制代码

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

发表评论取消回复

表情：

评论列表（有 0 条评论，239人围观）

还没有评论，来说两句吧...

相关阅读

相关 Map.entry详解

Map.entrySet() 这个方法返回的是一个Set<Map.Entry<K,V>>，Map.Entry 是Map中的一个接口，他的用途是表示一个映射项（里面有Key和Va

ゞ浴缸里的玫瑰/ 2024年04月08日 10:18/ 0 赞/ 61 阅读

相关 JavaScript 实现Map

var map=new Map(); map.put("a","A");map.put("b","B");map.put("c","C"); map.get("a"); /

系统管理员/ 2022年08月24日 04:09/ 0 赞/ 185 阅读

相关 java Map及Map.Entry详解

Map是java中的接口，Map.Entry是Map的一个内部接口。 Map提供了一些常用方法，如keySet()、entrySet()等方法。 keySet()方法返回值

小咪咪/ 2022年08月20日 10:14/ 0 赞/ 61 阅读

相关 Sass map详解

作为一个CSS预处理器，[Sass][]正受到越来越多的青睐，诸如Github、Codepen、CSS-Tricks、SitePoint、w3cplus等网站采用Sass组织、

川长思鸟来/ 2022年08月07日 01:38/ 0 赞/ 234 阅读

相关 java Map及Map.Entry详解

Map是java集合中的接口，Map.Entry是Map的一个内部接口。 Map提供了一些常用方法，如keySet()、entrySet()等方法。 // keySet()

ゞ浴缸里的玫瑰/ 2022年08月05日 10:25/ 0 赞/ 184 阅读

相关 JavaScript Source Map 详解

![bg2013012203.png][] 这是2.0版之前的最后一个新版本，有很多新功能，其中一个就是支持Source Map。访问 [http://ajax.goog

ゝ一纸荒年。/ 2022年07月28日 00:04/ 0 赞/ 190 阅读

相关 JavaScript之forEach()、map()、reduce(),filter() 的区别详解

首先我给出一段代码： <!DOCTYPE html> <head> <meta http-equiv="Content-Type" content="

短命女/ 2022年05月29日 07:45/ 0 赞/ 174 阅读

相关 Map详解

转载请注明链接:[https://blog.csdn.net/feather\_wch/article/details/82500561][https_blog.csdn.ne

阳光穿透心脏的1/2处/ 2022年05月14日 12:13/ 0 赞/ 208 阅读

相关 javascript map详解

map() 不会对空数组进行遍历 let arr = [] let newArr = arr.map((item, i, arr)

淡淡的烟草味﹌/ 2022年03月15日 10:00/ 0 赞/ 240 阅读

相关 JavaScript Source Map 详解

![bg2013012203.png][] 这是2.0版之前的最后一个新版本，有很多新功能，其中一个就是支持Source Map。访问 [http://ajax.goog

小咪咪/ 2022年01月26日 03:19/ 0 赞/ 238 阅读