龙空技术网

JavaScript 数组中map函数的用法

css初学 1700

前言:

现时我们对“js数组map方法”大约比较注重,同学们都想要剖析一些“js数组map方法”的相关内容。那么小编也在网摘上搜集了一些对于“js数组map方法””的相关内容,希望你们能喜欢,看官们快快来了解一下吧!

数组中map方法 接受一个callbackFunction作为参数 执行后返回由 单个数组元素执行callbackFunction返回值组成的新数组

arr.map(callback,thisArg)

要点:

1 接受callback 并且数组中的元素会执行该方法

2 返回值为数组 数组的单个元素的值为方法的返回值

3 callback 接受参数的个数 (value ,index, arr)

4 thisArg 如果callback中使用this 并且需要绑定某个对象为其this的值 可以传递该参数

语法:

arr.map(callback)

callback(currentValue, index,arr)

callback 函数的参数会自动传入

所以callback 的参数值要对应传入的值 尤其出现callback 有默认可为空的参数时

currentValue 当前要处理的值

index 当前要处理的索引

参数arr 原有数组 arr参数为数组的快照 在callback中操作arr参数 不会影响原有数组 但是可以操作原数组

用法:

callback 接受参数的值

函数会被自动传入三个参数:数组元素,元素索引,原数组本身

callback 返回数组的大写字符 将数组的元素全部变成大写

通过map函数返回数组的大写字符

callback没有返回值的时候会返回 undefined

callback返回值

thisArg用法

arr.map(callback,thisArg)

thisArg用于绑定callback function 中的this参数

如:

object.callback

图中arr 的map 函数使用object.print 为callback 参数

callback参数使用了this.name

1 this的值 如果没有指定thisArg 或者指定为null 或undefined 会默认绑定为window对象

2 es6 如果callback 箭头函数可以忽略这一点 因为箭头函数已经绑定了this

3 es6 callback 之前使用bind函数绑定过this 也可以忽略

没有绑定thisArg

1 this的值 如果没有指定thisArg 或者指定为null 或undefined 会默认绑定为window对象

绑定object

2 es6 如果callback 箭头函数可以忽略这一点 因为箭头函数已经绑定了this

箭头函数绑定thisArg

es6 callback 之前使用bind函数绑定过this 也可以忽略thisArg的绑定

bind函数绑定过对象后 thisArg的绑定会忽略掉

callback 中的原有数组参数为快照 操作不影响原有数组 callback 函数中可以操作原有数组

操作原有数组

ps:

1 返回值 为执行callback函数返回值组成的新数组

2 callback 中的原有数组参数为快照 操作不影响原有数组 callback 函数中可以操作原有数组

3 callback thisArg参数用于绑定callback this变量

标签: #js数组map方法