基礎!使用map返回一個新的數組要注意哦

定義和用法 map() 方法返回一個新數組,數組中的元素爲原始數組元素調用函數處理後的值。
這段話仍是比較繞口的,沒動腦子的時候,意思就是返回一個新數組唄,結果某次用了map,原變量還沒改呢,就發現結果變了,唉呀媽呀,可神奇了。
錯誤示範php

let arr = [{a:1,b:2},{a:2,b:3}];
let newArr = arr.map(v => {
    v.a += 1;
    v.b += '1';
    return v
});
console.log(arr); // [{a:2,b:'21'},{a:3,b:'31'}]
console.log(newArr); // [{a:2,b:'21'},{a:3,b:'31'}]

隨意感覺下,很崩潰。
分析 形成這個緣由是由於,他返回的數組,就是return了一個處理過的對象啊,那js的引用類型仍是毛變化都沒有,那個改變(v),就等於改變了指向同一個地址的v,呵呵了。
那麼知道爲啥就好辦了,首先想到的就是assign
Object.assign() 方法用於將全部可枚舉屬性的值從一個或多個源對象複製到目標對象。它將返回目標對象。
其餘的嘛,不加班的那一天再想吧。數組

let arr = [{a:1,b:2},{a:2,b:3}];
let newArr = arr.map(v => {
    let v1 = Object.assign({},v);
    v1.a += 1;
    v1.b += '1';
    return v1
});
console.log(arr); // [{a:1,b:2},{a:2,b:3}]
console.log(newArr); // [{a:2,b:'21'},{a:3,b:'31'}]

轉載於猿2048:▶《基礎!使用map返回一個新的數組要注意哦》函數

相關文章
相關標籤/搜索