concat不是es6語法，它是es5時就有的，優(yōu)點是兼容性高，不需要轉(zhuǎn)譯。concat方法用于多個數(shù)組的合并，使用語法“原數(shù)組對象.concat(新值)”；該方法可接受數(shù)組參數(shù)，也可接受其他類型的值作為參數(shù)。concat方法會將新數(shù)組的成員，添加到原數(shù)組成員的后部，然后返回一個新數(shù)組，原數(shù)組不變。

前端（vue）入門到精通課程：進入學習
Apipost = Postman + Swagger + Mock + Jmeter 超好用的API調(diào)試工具：點擊使用

本教程操作環(huán)境：windows7系統(tǒng)、ECMAScript 6版、Dell G3電腦。

concat不是es6語法，它是es5時就有的。

ES5 數(shù)組方法concat()

concat方法用于多個數(shù)組的合并。它將新數(shù)組的成員，添加到原數(shù)組成員的后部，然后返回一個新數(shù)組，原數(shù)組不變。

• 請注意，concat()方法并沒有修改當前Array，而是返回了一個新的Array。

['hello'].concat(['world']) // ["hello", "world"]  ['hello'].concat(['world'], ['!']) // ["hello", "world", "!"]  [].concat({a: 1}, {b: 2}) // [{ a: 1 }, { b: 2 }]  [2].concat({a: 1}) // [2, {a: 1}]

除了數(shù)組作為參數(shù)，concat也接受其他類型的值作為參數(shù)，添加到目標數(shù)組尾部。

[1, 2, 3].concat(4, 5, 6) // [1, 2, 3, 4, 5, 6]

• 實際上，concat()方法可以接收任意個元素和Array，并且自動把Array拆開，然后全部添加到新的Array里。即如果要進行concat() 操作的參數(shù)是數(shù)組，那么添加的是數(shù)組中的元素，而不是數(shù)組。

var arr = ['A', 'B', 'C']; arr.concat(1, 2, [3, 4]); // ['A', 'B', 'C', 1, 2, 3, 4]

注意：concat只會拉平數(shù)組參數(shù)一次，不會拉平兩次

arr.concat([1, [2, 3]]); // [1, 2, 3, 1, [2, 3]]

• 如果數(shù)組成員包括對象，concat方法返回當前數(shù)組的一個淺拷貝。所謂“淺拷貝”，指的是新數(shù)組拷貝的是對象的引用。

var obj = { a: 1 }; var oldArray = [obj];  var newArray = oldArray.concat();  obj.a = 2; newArray[0].a // 2

上面代碼中，原數(shù)組包含一個對象，concat方法生成的新數(shù)組包含這個對象的引用。所以，改變原對象以后，新數(shù)組跟著改變。

擴展知識：數(shù)組合并的另一種方法

使用ES6擴展運算符…合并

const name1 = ['A','B','C'];         const name2 = ['D','E','F'];         const name = [...name1,...name2]         console.log(name);

對比：ES6擴展運算符…與ES5-concat

concat是es5時就有的，優(yōu)點是兼容性高，不需要轉(zhuǎn)譯

...是es6新出的語法，簡化了寫法，代碼看上去更簡潔直觀，但實際只是做了封裝，底層還是用的原來的方法，如下為babel轉(zhuǎn)譯的結(jié)果

arr1 = [...arr1, ...arr2];   ↓ 相當于 function _toConsumableArray(arr) {  if (Array.isArray(arr)) {     for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2;     } else { return Array.from(arr); } } arr1 = [].concat(_toConsumableArray(arr1), arr2);

【