ホームページ >ウェブフロントエンド >フロントエンドQ&A >concat は es6 の構文ですか?
concat は es6 の構文ではなく、es5 で利用可能ですが、互換性が高く翻訳が不要な点が利点です。 concat メソッドは、「元の配列 object.concat(new value)」という構文を使用して、複数の配列をマージするために使用されます。このメソッドは、配列パラメーターおよびその他のタイプの値をパラメーターとして受け入れることができます。 concat メソッドは、新しい配列のメンバーを元の配列メンバーの末尾に追加し、元の配列を変更せずに新しい配列を返します。
このチュートリアルの動作環境: Windows 7 システム、ECMAScript バージョン 6、Dell G3 コンピューター。
concat は es6 構文ではありませんが、 es5 で使用できます。
ES5 配列メソッド concat()
concat
メソッドは 複数の配列に使用されます # ##マージ###。新しい配列のメンバーを元の配列メンバーの末尾に追加し、元の配列 を変更せずにそのままにして、新しい配列を返します。
を変更せず、新しい
Array を返すことに注意してください。
<pre class="brush:php;toolbar:false">['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}]</pre>
[1, 2, 3].concat(4, 5, 6) // [1, 2, 3, 4, 5, 6]
実際、concat() を受け取り、
Array を自動的に逆アセンブルできます。 , 次に、それらをすべて新しい
Array に追加します。つまり、
concat() 操作のパラメーターが配列の場合、配列ではなく配列内の要素が追加されます。
<pre class="brush:php;toolbar:false">var arr = ['A', 'B', 'C'];
arr.concat(1, 2, [3, 4]); // ['A', 'B', 'C', 1, 2, 3, 4]</pre>
注: arr.concat([1, [2, 3]]); // [1, 2, 3, 1, [2, 3]]
配列メンバーにオブジェクトが含まれる場合、 concatを返します。いわゆる「浅いコピー」とは、新しい配列が
オブジェクトの参照 をコピーすることを意味します。 var obj = { a: 1 }; var oldArray = [obj]; var newArray = oldArray.concat(); obj.a = 2; newArray[0].a // 2上記のコードでは、元の配列にはオブジェクトが含まれており、
元のオブジェクトを変更すると、新しい配列も 変更されます。
ES6 拡張演算子を使用する
マージ
const name1 = ['A','B','C'];
const name2 = ['D','E','F'];
const name = [...name1,...name2]
console.log(name);
concat は es5 の場合に使用できます。利点は次のとおりです。互換性が高く、翻訳する必要がありません。
... は es6 の新しい構文で、記述方法が簡素化されています。コードはより簡潔で直感的に見えますが、実際にはカプセル化されているだけで、最下位層はまだ元のメソッドを使用しており、以下はバベル変換の結果です <pre class="brush:php;toolbar:false">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);</pre>
[関連する推奨事項:
以上がconcat は es6 の構文ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。