技术输出之JavaScript—数组map方法

简单介绍一下本人，大四毕业生，目前是在一家实体企业做前端实习，现开发的项目任务并不是很多，所以工作也就比较轻松。接下来输出一些自己平时的学习和领悟，谢谢大家！

数组map方法 -return里面的元素

官方解释：

**map方法会传入三个参数：遍历的元素，元素索引，数组本身！（item，index，arr）
**

map() 方法返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。

map() 方法按照原始数组元素顺序依次处理元素。

注意： map() 不会对空数组进行检测。

注意： map() 不会改变原始数组。

let myValue = this.myList.map((item)=>{
  if(item === 4) { return item*2 } 
        return item; });
        console.log(myValue);     //  [1, 2, 3, 16]     

let myValue = this.myList.map((item)=>{  
    if(item === 4) {   item*4   }  
        return item;}); 
        console.log(myValue, 888);
   // [undefined, undefined, undefined, 8]
// map 对数组的每一项元素进行遍历，调用函数处理每一个元素返回的结果，所以需要加return

在实际开发和工作中，map也是相当好用 

  getInterviee() {      return this.dj_api_extend(selectPersonService.getPersonnelList).then(res => {        return res.list.map((item) => {          return {            label: item.name,            value: item.id,          };        });      });    }
//这是实际开发项目的一个例子请求接口 处理数据 返回我们想要的数据 
格式为数组 [{label: '冯浩然' value: 27},{  label: 陈鹏,  value: 28}]

下面为一个简单案例

    testList() {      return this.myList.map((item)=>{        return {          title: item.name,          num: item.age - 18,          word: item.hobby        };      });
 myList: [        {name: '冯浩然', age: 18, hobby: '自驾'},        {name: '陈棚', age: 20, hobby: '美食'},        {name: '刘贤梁', age: 22, hobby: '游戏'},      ]在data里为一个对象
返回的结果为
[{title: "冯浩然", num: 0, word: "自驾"},{title: "陈棚", num: 2, word: "美食"},{title: "刘贤梁", num: 4, word: "游戏"}] 一个对象数组// 可以在return里面 对数据进行相关数据操作 比如运算 更改格式

map不会修改原数组，而是返回新数组，所以就不会影响到之前的数据，这点就比较好！