Why does changing an Array in JavaScript affect copies of the array?

后端 未结 11 1866
礼貌的吻别
礼貌的吻别 2020-11-22 00:16

I\'ve written the following JavaScript:

var myArray = [\'a\', \'b\', \'c\'];
var copyOfMyArray = myArray;
copyOfMyArray.splice(0, 1);
alert(myArray); // aler         


        
11条回答
  •  梦谈多话
    2020-11-22 00:17

    Cloning objects -

    A loop / array.push produces a similar result to array.slice(0) or array.clone(). Values are all passed by reference, but since most primitive data types are immutable, subsequent operations produce the desired result - a 'clone'. This is not true of objects and arrays, of course, which allow for modification of the original reference (they are mutable types).

    Take the following example:

    const originalArray = [1, 'a', false, {foor: 'bar'}]
    const newArray = [];
    
    originalArray.forEach((v, i) => {
        newArray.push(originalArray[i]);
    });
    
    newArray[0] = newArray[0] + 1;
    newArray[1] = 'b';
    newArray[2] = true;
    newArray[3] = Object.assign(newArray[3], {bar: 'foo'});
    

    The operations run on the newArray indices all produce the desired result, except the final (object), which, because it is copied by reference, will mutate the originalArray[3] as well.

    https://jsfiddle.net/7ajz2m6w/

    Note that array.slice(0) and array.clone() suffers from this same limitation.

    One way to solve this is by effectively cloning the object during the push sequence:

    originalArray.forEach((v, i) => {
        const val = (typeof v === 'object') ? Object.assign({}, v) : v;
        newArray.push(val);
    });
    

    https://jsfiddle.net/e5hmnjp0/

    cheers

提交回复
热议问题