こんにちわ。 KMC3回生の id:tyage です。
6/2にECMAScript6勉強会の第1回を、6/9に第2回を行いました。
ECMAScript 6 compatibility table を参考に、新しい構文や関数をピックアップして ECMAScript Language Specification ECMA-262 6th Edition - DRAFT を読みました。
第1回
第1回では arrow function, Proxy, RegExpのyフラグとuフラグを読みました。
arrow function
arrow functionはfunction式よりも構文が短い関数式で、以下のようにかけます。
var func = (arg1, arg2) => arg1 + arg2 func(1, 2) // => 3
ただし以下の点で、function式と異なっているようでした。
- 一行で書く場合は暗黙的にreturnがつく
this
の値がlexicalである- constructorを持たない(newできない)
一行で関数式がかけるのはとても便利ですね。
Proxy
ProxyはObject用のmeta-programming APIに当たるもので、for (a in b)
でループを回した時や、a.child = b
と値をセットした時等の動作を関数呼び出しに置き換えることができます。
先ほどのarrow functionもProxyと組み合わせることでconstructorを持たせることができるようでした。
var p = Proxy(() => 1, { construct: function() {} });
RegExp
yフラグをつけていると、lastIndexプロパティ以降の文字列でマッチするようになります。
uフラグはunicodeの文字を正規表現でうまく扱うためのフラグです。
uフラグはまだ実装されている環境がないので早く実装が望まれます。
第2回
第2回ではdefault function params, Array.prototype.findIndex, Array.prototype.find, Array.prototype.fillを読みました。
default function params
default function paramsが入ったことで、関数呼び出し時の引数がundefined
の時にセットされるデフォルト引数を設定できるようになりました。
func = (a, b = a + 2) => b func(4) // => 6 func(1, 2) // => 2
Array.prototype.findIndex, Array.prototype.find, Array.prototype.fill
Array.prototype.findIndex, Array.prototype.findに関してはLo-DashのfindIndex, findと似たもので、要素をcallbackに渡してtrueが返ってきたものを見つけるメソッドです。
[10, 20, 30, 40, 50].findIndex((i) => i > 30) // => 3 [10, 20, 30, 40, 50].find((i) => i > 30) // => 40
Array.prototype.fillは第1引数の値で配列を埋めることができるメソッドです。
第2、第3引数の値でそれぞれ開始位置、終了位置のインデックスを指定することができます。 (インデックスには負の値を指定して、末尾からのインデックスとすることもできます。)
次回は6/16(月)です。