为什么数组连接在 Javascript 中不起作用？ [关闭]答案

【问题标题】：Why Doesn't Array Concatenation Work in Javascript? [closed]为什么数组连接在 Javascript 中不起作用？ [关闭]
【发布时间】：2022-02-09 04:10:49
【问题描述】：

当我在 JavaScript 中创建两个数组并尝试使用 concat 关键字连接它们时，生成的数组始终为空（嗯，数组中应该插入的东西没有插入）。我无法想象这实际上是 JS 应该如何工作的，因为……如果 concat 关键字什么都不做，那它的意义何在？

那么我肯定做错了什么，但我完全按照文档进行操作。

这是一个演示我的问题的小提琴：https://jsfiddle.net/webwhizjim/7z4v33of/

// Example with objects- doesn't work...
var greetings = [{"affirmative":"yeah"}];
var exclamations = [{"omg":"Oh my golly-gee-wilickers!"},{"wowz":"wowzers!"}];

var obArray = [];

obArray.concat(greetings);
console.log("The jumble array is: " + obArray);

// Example with strings- still doesn't work...

var greetings2 = ["affirmative","yeah"];
var exclamations2 = ["omg"];

var obArray2 = ["huh?"];

[].concat.call(obArray2, greetings2);
console.log("The jumble array is: " + obArray2);

为了清楚“它不起作用”，我的意思是控制台输出是这样的：

PS。在我的真实项目中，我使用的是 Angular 1.4；所以，如果有办法用它来concat 数组，我愿意接受。

【问题讨论】：

concat 返回一个新数组，它不会发生变异。
^obArray2 = obArray2.concat(greetings2)
另外，Function.prototype.call 的第一个参数定义了调用的上下文（this 的值），而不是第一个要连接的数组
@Sebas 是的，但事实证明在这种情况下它是正确的；第一个例子是多余的。
RTFM

标签： javascript arrays

【解决方案1】：

.concat() 创建一个新数组并返回它。它不会将元素添加到现有数组中。

来自MDN：

concat 创建一个由对象中的元素组成的新数组它被称为，然后依次为每个参数，该参数的元素（如果参数是一个数组）或参数本身（如果参数不是数组）。

concat 不会改变这个或任何作为参数提供的数组而是返回一个包含相同副本的浅表副本从原始数组组合的元素。原始元素数组被复制到新数组中，如下所示：

您可以使用.splice() 或.push() 将元素添加到现有数组中。

var greetings2 = ["affirmative","yeah"];
var obArray2 = ["huh?"];
obArray2.push.apply(obArray2, greetings2);

// display result in snippet
document.write(JSON.stringify(obArray2));

或者，直接使用.concat()新返回的数组：

    var greetings2 = ["affirmative","yeah"];
    var obArray2 = ["huh?"];
    var newArray = obArray2.concat(greetings2);

    // display result in snippet
    document.write(JSON.stringify(newArray));

【讨论】：

【解决方案2】：

正如其他人所说，.concat 返回一个新数组，并且不会改变您正在使用的数组的原始状态。如果你想通过.concat 连接两个数组的值，你必须将它存储在一个变量中，或者简单地在你需要的地方进行连接。

示例：

var greetings = [{"affirmative":"yeah"}];
var exclamations = [{"omg":"Oh my golly-gee-wilickers!"},{"wowz":"wowzers!"}];

var obArray = greetings.concat(exclamations);

console.log(obArray); // returns [obj, obj, obj]

这会给你同样的结果：

console.log(greetings.concat(exclamations));

最后一件事。像.concat 这样的方法是可链接的。

【讨论】：

【解决方案3】：

尝试以下方法：

var greetings = [{"affirmative":"yeah"}];
var exclamations = [{"omg":"Oh my golly-gee-wilickers!"}, {"wowz":"wowzers!"}];

var obArray = Array.prototype.concat.apply([], greetings, exclamations);
console.log("The jumble array is: " + obArray);
//Console Output: The jumble array is: [object Object]

var greetings2 = ["affirmative","yeah"];
var exclamations2 = ["omg"];

var obArray2 = [].concat(greetings2, exclamations2);
console.log("The jumble array is: " + obArray2);
//Console Output: The jumble array is: affirmative,yeah,omg

【讨论】：