如何克隆数组并在链中推送新值？

Question

如果我克隆一个数组并像这样推送一个值：

var arr1 = ["foo", "bar"];
var arr2 = [...arr1];
arr2.push("moo");

console.log(arr2); //["foo", "bar", "moo"]

它的行为符合我的预期。但是，如果我像这样链接 push 方法：

var arr1 = ["foo", "bar"];
var arr2 = [...arr1].push("moo");

console.log(arr2); //3 WTF?

我没想到。为什么链接 .push() 就像第二个示例 return 数字 3 而不是值数组？

Answer 1

array.push returns 您存储在 arr2 变量中的数组的新长度。

您需要以下内容：

var arr1 = ["foo", "bar"];
var arr2 = arr1.concat("moo");
console.log(arr2);

Answer 2

正如mehulmpt所说，Array.prototype.push() returns推入数组后的新长度。但是，使用 concat 非常慢。相反，~~spread~~ 切片第一个数组和 push 新值在单独的行上：

const arr1 = ["foo", "bar"];
const arr2 = arr1.slice();
arr2.push("moo");

console.log(arr1, arr2)

JSPerf here

编辑：完全忘记了切片。切片比传播更快，请改用它。

Answer 3

如果你绝对想强制执行链接，你可以在数组原型上创建你自己的函数。（虽然你应该明白its implication。）

我建议不要使用相同的方法名称，所以如果您想沿用该方法，请发明您自己的名称。

这是一个例子：

Array.prototype.add = function(elem) {
    this.push(elem)
    return this
}

const myArray = [].add("foo").add("bar")

console.log(myArray) // logs: [ 'foo', 'bar' ]

如何克隆数组并在链中推送新值？

How to clone an array and push new value in a chain?

javascript

arrays

chaining

ecmascript-6