javascript合并兩個數(shù)組最簡單的實現(xiàn)方法
在開發(fā)的過程中，我們很多時候會遇到需要將兩個數(shù)組合并成一個數(shù)組的情況出現(xiàn)。
var arr1 = [1, 2, 3]; var arr2 = [4, 5, 6]; // 將arr1和arr2合并成為[1, 2, 3, 4, 5, 6]
這里總結(jié)一下在JavaScript中合并兩個數(shù)組的方法。
for循環(huán)數(shù)組
這個方式是最簡單的，也是最容易實現(xiàn)的。
var arr3 = [];
// 遍歷arr1
for (var i = 0; i < arr1.length; i++) {
arr3.push(arr1[i]);
}
// 遍歷arr2
for (var j = 0; j < arr2.length; j++) {
arr3.push(arr2[j]);
}
console.log(arr3); // [1,2,3,4,5,6]
另外也可以用增強型for循環(huán)或forEach()方法去實現(xiàn)。
for循環(huán)這種方式幾乎沒有任何問題，只是很多追求精簡編程的人會鄙視這種方式（攤手）。
concat()方法
JavaScript的Array對象中提供了一個concat()方法，作用是連接兩個或更多的數(shù)組，并返回一個新的數(shù)組。
var arr3 = arr1.concat(arr2); console.log(arr3); // [1,2,3,4,5,6]
要注意的是，concat()方法不會改變原數(shù)組，而是返回一個新的數(shù)組。這樣，當(dāng)我們需要進行多次數(shù)組合并的時候，就會造成內(nèi)存浪費。
apply()方法
函數(shù)的apply方法有一個特性，那就是func.apply(obj,argv)，argv是一個數(shù)組。所以我們可以利用這點。
arr1.push.apply(arr1, arr2);
調(diào)用arr1.push這個函數(shù)實例的apply()方法，同時把arr1、arr2當(dāng)作參數(shù)傳入，這樣arr1.push這個方法就會遍歷arr1和arr2數(shù)組的所有元素，達到合并的效果。
簡單理解就是，上面這段代碼可以看做是：
arr1.push(4, 5, 6);
這種方式只用一行代碼就解決了問題，可以說非常6了。
總結(jié)
上面三種方法在常規(guī)使用上其實并沒有區(qū)別，只是要另外注意兩個小問題：
1.以上3種合并方法在舉例的時候并沒有考慮過兩個原數(shù)組誰的長度更小，好的做法是預(yù)先判斷兩個原數(shù)組哪個更大，然后使用大數(shù)組合并小數(shù)組，這樣就能減少了數(shù)組元素操作的次數(shù)，提高了代碼的執(zhí)行效率。
2.有時候我們既不希望原數(shù)組（arr1、arr2）改變，又不想手動新增一個變量，這時就只能使用concat()方法了。
以上方法很簡單，感謝大家的學(xué)習(xí)和對腳本之家的支持。
相關(guān)文章
這篇文章主要介紹了JavaScript交換兩個變量方法實例,文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2019-11-11
這篇文章主要為大家詳細介紹了JavaScript實現(xiàn)好看的跟隨彩色氣泡效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-02-02
uni-app是一個使用Vue.js開發(fā)所有前端應(yīng)用的框架,開發(fā)者編寫一套代碼,可以發(fā)布到IOS、Android、Web（響應(yīng)式）、以及各種小程序、快應(yīng)用等多個平臺,下面這篇文章主要給大家介紹了關(guān)于uniapp高頻面試題及答案的相關(guān)資料,需要的朋友可以參考下2023-02-02
js實現(xiàn)iframe框架取值的方法(兼容IE,firefox,chrome等)
這篇文章主要介紹了js實現(xiàn)iframe框架取值的方法,可兼容IE,firefox,chrome等瀏覽器.涉及JavaScript針對框架元素取值的相關(guān)技巧,需要的朋友可以參考下2015-11-11
有時候我們在網(wǎng)頁上需要增加一個下載按鈕，讓用戶能夠點擊后下載頁面上的資料，那么怎樣才能實現(xiàn)功能呢？今天小編給大家分享兩種方法實現(xiàn)js實現(xiàn)點擊按鈕下載文件，需要的朋友參考下吧2016-11-11
javascript基礎(chǔ)知識之html5輪播圖實例講解（44）
這篇文章主要為大家詳細介紹了javascript基礎(chǔ)知識之html5輪播圖，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-02-02
完美解決spring websocket自動斷開連接再創(chuàng)建引發(fā)的問題
下面小編就為大家?guī)硪黄昝澜鉀Qspring websocket自動斷開連接再創(chuàng)建引發(fā)的問題。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-03-03
實現(xiàn)NodeJS與Mysql的交互首先把Mysql Module裝到NodeJS中，具體實現(xiàn)及結(jié)果截圖如下，有此需求的朋友可以參考下，希望對大家有所幫助2013-08-08
JavaScript高級程序設(shè)計 閱讀筆記（二十） js錯誤處理
語法錯誤,也稱解析錯誤，發(fā)生在傳統(tǒng)語言的編譯時，在JavaScript中發(fā)生在解釋時,運行時錯誤也稱為異常（exception，在編譯期/解釋器后）2012-08-08
以下頁面在運行中,調(diào)試輸出的永遠是alter('1'),原因是按照頁面加載從上至下的順序,同名的方法以最后一個為準(zhǔn).2009-01-01