javascript - 从 Array.prototype.map() 返回不一致

Question

我正在尝试从以下位置获取此输出['1', '12', '123']:

   getSubstrings('123');

   function getSubstrings(string) {
      let array = string.split('');
      let subarray = [];
      return array.map(element => {
        subarray.push(element);
        console.log(subarray)       //this gets me ['1'], then ['1','2'] ...
        return subarray;            //but this is not returning the same as in console.log(subarray)   
      });
      
    }

我知道通过将 .join('') 添加到 subarray 的末尾可以获得我想要的结果。我的问题不是如何获取 ['1', '12', '123'] 但是，为什么返回与控制台上输出的子数组相同的子数组会导致 [ [1','2','3'], ['1','2','3'], ['1','2','3']] 而不是 [[1], [1,2], [1,2,3]] 很奇怪，console.log(subarray) 的输出与 .map( 中填充的返回子数组不同) )我在这里错过了什么吗？提前致谢。

Answer 1

问题是子数组在每次映射“迭代”中都会发生变化，因为您没有创建新的子数组，只是传递相同的引用来返回。它将改变所有这三种情况。

首先，它返回 [1]，但随后返回 [1,2] 并将第一个更改为 [1,2]。最后一个元素也会发生同样的情况。最后，您将拥有一个由同一引用的三个副本(子数组)组成的数组。

通过spread operator修复它

function getSubstrings(string) {
      let array = string.split('');
      let subarray = [];
      return array.map(element => {
        subarray.push(element);
        return [...subarray].join(""); // join to get the desired output  
      });
    }

console.log(getSubstrings("123"))