如何在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>