In JS, why does the slice() documentation say it is a shallow copy when it looks like a deep copy?

后端 未结 3 440
暗喜
暗喜 2021-01-21 19:26

According to the docs for Array.prototype.slice() in JavaScript, the slice() method returns a shallow copy of a portion of an array into a new array. It is my under

3条回答
  •  后悔当初
    2021-01-21 20:20

    It's doing a shallow copy. But the values in that shallow copy point to the original arrays/objects, because they're object references.

    So let's say we have:

    var orig = [ [1] ];
    

    In memory we have:

                        +−−−−−−−−−−−−−+
    [orig:Ref22157]−−−−>|   (array)   |
                        +−−−−−−−−−−−−−+        +−−−−−−−−−−−−−+
                        | 0: Ref84572 |−−−−−−−>|   (array)   |
                        +−−−−−−−−−−−−−+        +−−−−−−−−−−−−−+
                                               | 0: 1        |
                                               +−−−−−−−−−−−−−+
    

    Now we do:

    var copy = orig.slice();
    

    and have:

                        +−−−−−−−−−−−−−+
    [orig:Ref22157]−−−−>|   (array)   |
                        +−−−−−−−−−−−−−+   
                        | 0: Ref84572 |−−−+
                        +−−−−−−−−−−−−−+   |
                                          |
                                          |    +−−−−−−−−−−−−−+
                                          +−−−>|   (array)   |
                        +−−−−−−−−−−−−−+   |    +−−−−−−−−−−−−−+
    [copy:Ref54682]−−−−>|   (array)   |   |    | 0: 1        |
                        +−−−−−−−−−−−−−+   |    +−−−−−−−−−−−−−+
                        | 0: Ref84572 |−−−+
                        +−−−−−−−−−−−−−+
    

    Notice how the reference to the nested array (shown here notionally as "Ref84572" but we never see the real values of object references) has been copied, but still refers to the same nested array.

    Here's proof it's shallow:

    var orig = [ [1] ];
    var copy = orig.slice();
    console.log("orig[0][0] = " + orig[0][0]);
    console.log("copy[0][0] = " + copy[0][0]);
    console.log("Setting copy[0][0] to 2");
    copy[0][0] = 2;
    console.log("orig[0][0] = " + orig[0][0]);
    console.log("copy[0][0] = " + copy[0][0]);

    Notice that when we modify the state of the nested array, we see that modification no matter which route we take to getting to it (orig[0][0] or copy[0][0]).

提交回复
热议问题