JavaScript Array map() 方法

先说说这个方法浏览器的支持：
支持五大主流的浏览器，
特别注意：IE 9 以下的浏览器不支持，只支持IE 9以上的版本的浏览器
特别注意：IE 9 以下的浏览器不支持，只支持IE 9以上的版本的浏览器
特别注意：IE 9 以下的浏览器不支持，只支持IE 9以上的版本的浏览器

一、定义和用法

map() 方法返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。
map() 方法按照原始数组元素顺序依次处理元素。
注意： map() 不会对空数组进行检测。
注意： map() 不会改变原始数组。

二、语法

array.map(function(currentValue,index,arr), thisValue)

三、参数说明

currentValue: 必须。当前元素的值
index: 可选。当前元素的索引值
arr: 可选。当前元素属于的数组对象
thisValue: 可选。对象作为该执行回调时使用，传递给函数，用作 “this” 的值。
如果省略了 thisValue，或者传入 null、undefined，那么回调函数的 this 为全局对象。

例子一：

把数组里每个值乘以2并返回一个新数组

ar arr = ["中国", "美国", "俄罗斯"];let newArr = arr.map((record,k) => {console.log(record)console.log(k)})// 1. 把数组里每个值乘以2并返回一个新数组let arr1 = [7,10,3,2]const newArr1 = arr1.map((record,k) => {return record * 2})console.log(newArr1) // 打印：  [14, 20, 6, 4]

例子二：

把数组里面每个值前面都加一个统一的姓叫“张”，并返回一个新数组

    // 2.把数组里面每个值前面都加一个统一的姓叫“张”，并返回一个新数组let arr2 = ['小米','华为','苹果']let newArr2= arr2.map((record,k) => {return '张' + record})console.log(newArr2)  // 打印： ['张小米', '张华为', '张苹果']

例子三：

3.遍历数组里每个对象，并返回新数组（要求新数组里每个对象有一个新的属性叫iq（值为50-100随机整数））,重点：不能影响原数组里面的对象

    let arr3 = [{name: '孙悟空',age:500},{name: '猪八戒',age:300},{name: '沙僧',age:309},{name: '唐三藏',age:200},{name: '白龙马',age:100}]let newArr3 = arr3.map((record, k) => {return {name: record.name,age: record.age,iq:Math.floor(Math.random()*(100-50+1)+50)}})console.log(newArr3)

例子三的打印结果：

例子四：

4. 遍历数组里每个对象，并返回新数组，要求新数组里每个对象只有name属性和值(并且不能影响原来数组里对象的属性和值)

let arr4 = [{name: '孙悟空',age:500},{name: '猪八戒',age:300},{name: '沙僧',age:309},{name: '唐三藏',age:200},{name: '白龙马',age:100}]let newArr4 = arr4.map((record,k) => {return {name: record.name}})console.log(arr4)console.log(newArr4)

例子四的打印结果：

例子五：

重构数组：用name的值作为key,age的值作为value，用来重构数组
方法一：

    // 方法一：结构出对象的键值对let newArr41 = arr4.map(({name,age}) => {return {[name]: age}})console.log(newArr41)

例子五中方法一的打印结果：

方法二：

    // 方法二：let newArr42 = arr4.map((record,k) => {return{[record.name]: record.age}})console.log(newArr42,'newArr42')

例子五中方法二的打印结果：