map函数会改变原数组的,注意

一，情景复现

今天做项目时遇到一个map的不严谨的地方，都知道的，map函数是不会改变原数组的。下面这个代码，猜猜它的结果是什么？

 let perons = [
          { name: "KangKang", age: 18 },
          { name: "Jay", age: 16 },
        ];
        let newPer = perons.map((item) => {
          item.age = item.age + 2;
          return item;
        });
        console.log(perons)
        console.log("new",newPer)

结果是这样的，

有没有出乎你的意料，但它确实改变了原数组。

二，解决方法

   let perons = [
          { name: "KangKang", age: 18 },
          { name: "Jay", age: 16 },
        ];
        // let newPer = perons.map((item) => {
        //   item.age = item.age + 2;
        //   return item;
        // });
        let newPer = perons.map((item) => ({
          ...item,
          age: item.age + 2,
        }));
        console.log(perons);
        console.log("new", newPer);

修改后的结果：

没有改变原数组。顺便说一下，map函数最好不要做过滤操作(if)