如何在javascript中连接两个数组？

Question

我看到这个响应用于扩展一个数组，所以我尝试了：

console.log(['a', 'b'].push.apply(['c', 'd']));

但它打印：

2

不应该打印：

['a', 'b', 'c', 'd']

如果不是我做错了什么？

Answer 1

如果不是我做错了什么？

首先， .push返回数组的新长度 ：

var arr = [1, 1, 1];
console.log(arr.push(1)); // 4
console.log(arr); // [1, 1, 1, 1]

其次， .apply需要两个参数：要将函数应用于的对象，以及参数数组。 您只传递一个参数，因此您的代码基本上等同于：

['c', 'd'].push()

即你没有在['c', 'd']数组中添加任何内容。 这也解释了为什么你在输出中看到2 ： ['c', 'd']长度为2而.push()不会向它添加任何元素，因此它仍然具有长度2 。

如果你想使用.push来改变原始数组（而不是创建像.concat这样的新数组），它必须看起来像：

var arr = ['a', 'b'];
arr.push.apply(arr, ['c', 'd']); // equivalent to Array.prototype.push.apply(arr, [...])
//              ^   ^--------^
//    apply to arr   arguments
console.log(arr); // ['a', 'b', 'c', 'd']

---

也可以看看

• 如何将某些内容附加到数组中？
• Javascript将数组值推送到另一个数组中

Answer 2

尝试这个：

 console.log(['a', 'b'].concat(['c', 'd']));

Answer 3

如果您的方案允许使用ES6语法，则可以使用spread元素来连接数组：

var arr1 = [1,2];
var arr2 = [3,4];
var arr3 = [...arr1, ...arr2];
console.log(arr3); // Logs [1,2,3,4]

Answer 4

如果您使用的是现代浏览器，则可以使用扩展运算符， ...如下所示：

console.log([...['a', 'b'], ...['c', 'd']])

如果你使用的是较旧的浏览器/没有转换器，那么concat是要走的路：

console.log(['a', 'b'].concat(['c', 'd']))

Answer 5

由于这里似乎存在对使用各种数组附加方法的一般误解，我将添加ES6引入扩展运算符的最安全的替代方法

功能语言

开发了功能语言以简化代码开发，允许程序员和系统工程师定义函数来替换常见的操作/算法。 JS是一种函数式语言，您编写函数以使生活更轻松，节省您的输入并使程序更容易测试和验证，所以为什么要用危险的替代品来对抗它。

答案中的错误（除了Jonathan Michalik的回答）是他们都试图强迫语言做一些应该由函数（ Function.apply ）完成的事情，或提供一个解决方案而不解释什么它正在做（ Array.concat ）。

例如，编写一个附加数组的函数。

function appendArray(array,array1){ // adds the items in array1 
                                    // array1 can be any type
                                    // to the end of array 
    var len,i;
    array1 = [].concat(array1);   // ensure array1 is an array
    len = array1.length;
    i = 0;
    while(i < len){
        array[array.length] = array1[i++]; // this is 2* quicker than invoking push
    }
    return array;
}

写入时需要60秒，或者作为通用库的一部分包含的内容更少，您创建了一个安全且通用的数组追加功能。

log(appendArray([0, 1, 2, 3], 4)); // 0,1,2,3,4
log(appendArray([0, 1, 2, 3], [4, 5, 6])); // 0,1,2,3,4,5,6

现在为什么其他答案不是好的解决方案。

Array.concat

是更安全的选项，如果您控制对数组的所有引用，则应该使用它。 它受到以下事实的影响：它在使用时会创建一个新数组。

var array1 = [1,2,3];
var array2 = [4,5,6];
array1 = array1.concat(array2); // 1,2,3,4,5,6

许多人错误地认为concat（array2）被添加到array1，它不是，它被添加到array1的副本中。 如果您对原始数组有其他引用，那么您最终会创建连接数组的副本，而原始数组仍保留在内存中。

function doSomething(array){
    ... generate some info
    array.concat(info);
}

var myArray = [...someData];  // the array
var myObject.setArray(myArray); // create a new referance to the array in myObject
myArray = doSomething(myArray);  // adds info via concat to the array.

它不是立即显现出来，你现在有两个数组里面myObject的原稿，在级联版本myObject ，其可以存储阵列在全球化志愿服务青年关闭，您不能更改或删除，除非取消引用所有相关内容。 您也不知道存在多少对原始数组的引用。

Function.apply（）

有许多理由不使用此函数，但特别注意在Array.push函数上使用它。 如果您在没有类型检查数组的情况下使用它，它会受到不确定性的影响。

var myArray = [1,2,3,4];
var data = getSomeData(); // may return array or array like data
myArray = doSomeWorkOn(myArray); // the spec says this may return undefined
myArray.push.apply(myArray,data); // what happen here is indeterminate and
                                     // depends on the JS context, the JS mode
                                     // and the JS version

如果不对未定义的myArray进行审查，则无法预测应用的结果。 它可能抛出错误，或者如果全局范围具有推送功能并且您没有处于严格模式，它可能会无声地失败。

在不知道JS版本ES5或ES6的情况下，apply可能会将一个对象data推送到myArray，或者data ES5中的所有项目都不会像ES6那样将数组对象识别为Function.apply数组。 所以你必须审核myArray ，或者data是当前JS版本的正确类型。

参数具有依赖于当前JS上下文的限制，JS上下文处理长参数列表之间也存在不一致。 有些会抛出错误，其他人会简单地截断参数。

var myPixelData = [];
myPixelData.push.apply(myPixelData,getSomePixelData()); // what will happen????

这可能会抛出，也可能会起作用，或者它可能只将65535个项目推送到阵列上，或更多或更少。 您必须将它包装在try catch中，并根据getPixelData返回的数组长度检查结果。 所有增加的复杂性只是为了让它更容易???

那么为什么在Array.push上使用Function.apply或者使用Array.concat时更容易编写一个函数来做你想做的事情并从一长串问题，模糊和错误中解决你。

Answer 6

你应该试试这个：

a= ['a', 'b'];
b= ['c', 'd'];
a.push.apply(a,b);

console.log(a);

Answer 7

你应该使用这样的变量

  <script type="text/javascript"> var arr1=['a', 'b']; var arr2=['c', 'd']; Array.prototype.push.apply(arr1, arr2); console.log(arr1); </script>