…ピリオド3つ

ときどき、こんな感じのJavaScriptソースがあります。

function foo(x, y, z) { }
var args = [0, 1, 2];
foo(...args);

ピリオドを3つ書くので、特殊な感じを受けますが、ES6で追加されたもので、ブラウザが対応していれば使用できます。

そうは言っても、ブラウザの実装に差異があるので、通常はbabel、それを扱うwebpackを利用して、書き出すことになると思います。

Spread Operator(スプレッドオペレータ / スプレッド演算子)と言います。

主な機能

配列やオブジェクトを展開します。

配列

配列を展開します。

var list = [1, 2];
list = [0, ...list, 3];
console.log(list); // [0,1,2,3]

新しい配列を作成できます。

var list = [1, 2];
var list2 = [...list];
console.log(list2); // [1,2]
console.log(list === list2); // false

オブジェクト

オブジェクトでも可能です。
プロパティを追加できます。

var point2D = {x: 1, y: 2};
var point3D = {...point2D, z: 4};
console.log(point3D); // {x: 1, y: 2, z: 4}

あとから書かれたもので上書きされます。

var point2D = {x: 1, y: 2};
var point3D = {x: 3, y: 4, z: 5, ...point2D};
console.log(point3D); // {x: 1, y: 2, z: 5}

まとめ

webpackなどで書き出すことが前提となるので、私の状況だと案件が限られてしまいますが、できるだけ積極的に使っていきたいです。