目录
map()客户管理系统开发定制不会修改原数组. arr.map((item, index, array))客户管理系统开发定制接受三个参数,第一个参数是arr的当前一项的值,第二个参数当前索引值,第三个参数是本身数组对象。
作用
1.遍历和进行运算
例子一:
- const arr = [1,4,9,16]
- console.log(arr.map((item) => Math.sqrt(item)))
结果如下:
例子二:
- let arr = ['aaa','bbb','ccc'];
- let arr2 = arr.map((x,i) => [x,i])
- console.log(arr2)
结果如下:
例子三:
- const bookList = [
- {"id":10,"title":"Web前端开发","price":99.9},
- {"id":11,"title":"C++","price":80.9},
- {"id":12,"title":"Python","price":100.9}
- ]
- console.log(bookList.map(book =>{
- return {title:book.title,price:book.price}
- }))
结果如下:
需要注意的点
1.map()的遍历会跳过空位置
但是它会保留空的元素!
- const arr = [1, , , 3, ,2 ,]
- console.log(arr.map((item) => item*2))
结果如下:
2.当有的时候,map显示NaN
- let arr = [1,2,3,4,5,6]
- console.log(arr.map(parseInt))
结果如下
为什么会这样? 答:parseInt有两个参数(parse,radix),如果可能,该函数会把传入的parse转换为数字,map会把index的值传给parseInt的radix参数。
那怎么避免这种情况的发生?答:我在这里介绍一下我在一本书上看到的一个函数unary 。这个函数的作用是让多个参数的函数只写一个参数
const unary = (fn) =>fn.length === 1 ? fn : (arg) => fn(arg)
例子一:
- const unary = (fn) =>fn.length === 1 ? fn : (arg) => fn(arg)
- btn.addEventListener('click', () => {
- let arr = [1,2,3,4,5,6]
- console.log(arr.map(unary(parseInt)))
结果如下: