在介紹前，拋出一個問題：如何將多個數組合併為一個數組？
以下的分享會分為如下小節：
1.concat方法的基礎介紹
2.從實例中感受concat方法
1.concat方法的基礎介紹
concat方法用於多個數組的合併。它將新數組的成員，添加到原數組的尾部，然後返回一個新數組，原數組不變。
console.log([].concat([1],[2],[3])); // [1, 2, 3]console.log([].concat([[1],[2],[3]])); // [[1], [2], [3]]console.log([].concat(4,[[5,6],[7]])); // [4, [5, 6], [7]]
上面代碼中，第一個返回值是將一個空數組與三個數組[1],[2],[3]合併為一個數組，因此返回了[1, 2, 3]。第二個是將一個空數組與一個二維數組合併，二維數組的成員為[1],[2],[3]，因此返回了[[1], [2], [3]]，注意，返回的是二維數組。第三個例子同理。這裡對概念的理解很重要，即將新數組的成員，添加到原數組的尾部。
除了接受數組作為參數，concat也可以接受其他類型的值作為參數。它們會作為新的元素，添加數組尾部。
console.log([].concat(1,2,3)); //[1,2,3];//等同於console.log([].concat(1,[2,3])); //[1,2,3];console.log([].concat([1],[2,3])); //[1,2,3];
這裡雖然內容較少，看起來挺簡單。但是真正理解起來真的不容易。
2.從實例中感受concat方法
說完基礎的知識，給大家看看我最近遇到的一個題目。原題是這樣的。
看例子就能明白是什麼意思了。
這道題目中，其中一個解決方案就是：
var flatten = function (arr){return [].concat.apply([],arr);};這一段簡單的函數就可以實現將數組中的元素合併的功能。但是當我在理解這個返回值的時候，出現了一個問題。
問題：為什麼使用apply方法和沒有使用apply方法會有區別？
console.log([].concat.apply([],[[1],[2],[3]])); //[1, 2, 3]console.log([].concat([[1],[2],[3]])); //[[1], [2], [3]]
上面代碼中，同樣是在一個空數組中向尾部添加新數組，第一個返回的是[1,2,3]。第二個卻是一個二維數組。
經過一段時間的折騰，終於理解了其中不同的原因所在。
首先，我們在空數組中調用實例方法concat的時候，是傳入concat中的參數，在push到數組的末尾。也就是說，會將空數組與傳入的數組的最外層數組進行合併，然後返回一個新數組。
console.log([].concat(1,2,3)); //[1, 2, 3]console.log([].concat([1],[2],[3])); //[1, 2, 3]console.log([].concat([[1],[2],[3]])); //[[1], [2], [3]]console.log([].concat([[[1],[2],[3]]])); // [[[1], [2], [3]]]
上面代碼中，從幾個數組，到一維數組，二維數組，三維數組逐漸變化的。
在Javascript中call，apply，bind方法的詳解與總結文章中，有提到apply方法的作用與call方法類似，也是改變this指向（函數執行時所在的作用域），然後在指定的作用域中，調用該函數。同時也會立即執行該函數。唯一的區別就是，它接收一個數組作為函數執行時的參數。
apply方法的第一個參數也是this所要指向的那個對象，如果設為null或undefined或者this，則等同於指定全局對象。第二個參數則是一個數組，該數組的所有成員依次作為參數，在調用時傳入原函數。原函數的參數，在call方法中必須一個個添加，但是在apply方法中，必須以數組形式添加。
console.log([].concat.apply([],[[1],[2],[3]])); //[1, 2, 3]console.log([].concat([[1],[2],[3]])); //[[1], [2], [3]]
從代碼可以看出，第一段代碼是先在空數組上先調用了concat方法，該方法的作用是將新數組的成員，添加到原數組的尾部。再調用了apply方法，傳入第一個參數，指定對象執行時所在的作用域，而第二個參數的作用是將數組中的所有成員一次作為參數，在調用時傳入數組中。
因此，在concat，apply方法同時使用的時候，兩個方法的作用會疊加，也就出現了與單獨使用concat不同的現象。看個例子。
console.log([].concat([1,2,3])); //[1, 2, 3]console.log([].concat.apply([],[[1],[2],[3]]));//[1, 2, 3]console.log([].concat([[1],[2],[3]]));//[[1], [2], [3]]console.log([].concat.apply([],[[[1],[2],[3]]]));//[[1], [2], [3]]console.log([].concat([[[1],[2],[3]]]));//[[[1], [2], [3]]]console.log([].concat.apply([],[[[[1],[2],[3]]]]));//[[[1], [2], [3]]]
上面代碼中，concat方法將最數組合併，然後在合併的基礎上在對下一層數組進行合併。
console.log([].concat.apply([],[[1],[2],[3]]));//[1, 2, 3]//相當於console.log([].concat(1,2,3)); //[1,2,3]
總結：
1.單獨使用concat方法時，會將新數組的成員，添加到原數組的尾部。
2.使用apply方法來指定concat方法的this指向時，會讓兩個方法的作用疊加。
3.數組元素合併的方法：
var flatten = function (arr){return [].concat.apply([],arr);}; var flatten = function (array){return array.reduce(function(a,b){return a.concat(b);},[])}以上所述是小編給大家介紹的javascript使用concat 方法對數組進行合併的方法，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對武林網網站的支持！