ECMAScript?
ブラウザやnode.jsなどに使われているスクリプト言語のJavaScriptなんですが、実は親が「ECMAScript」という言語である。JavaScriptの文法などはすべてECMAScriptを基準にしているので、ECMAScriptの新機能や基準も次期のJavaScriptに移行する可能性が高い。
ECMAScript 6
現行のJavaScriptはECMAScript5をベースにしている。ECMAScript6は次期のJavaScriptとも考えられる。(すべての新機能が取り入れるかどうかはわからない。)
ECMAScript6が楽しみなとこ
ECMAScript6を試してみたところ、すごい楽しみな新機能がいくつあった:
「=>」矢印
JavaScriptを書く人はわかると思うが、一日function()
を何回書いたのかわからないぐらい繰り返してる。ECMAScript6はもっと便利な記述方を導入しました。
Before
var animals = ["dog", "cat", "duck"];
animals.map(function(s){
return s.toUpperCase();
});
var my_fav = [];
animal.forEach(function (a) {
if (a == "duck") {
two_foot.push(a);
}
});
console.log(my_fav); //[ 'DOG', 'CAT', 'DUCK' ]
After
let animals = ["dog", "cat", "duck"];
animals.map(s => s.toUpperCase());
//[ 'DOG', 'CAT', 'DUCK' ]
var my_fav = [];
animals.forEach(a => {
if (a == "cat") {
my_fav.push(a);
}
});
console.log(my_fav); //[ 'duck' ]
これまさに今すぐでもほしい機能だと思う。CoffeeScriptはすでに導入されているが、やはりこれは言語レベルでサポートしてほしい!
文字列の補間
JavaScriptで変数と文字列を混ぜてプリントする時に、+
で変数と文字列と繋がってプリントするのが一般的:
var name = "みらい";
var greeting = "よろしくお願いします。";
console.log(name + 'です。' + greeting);
// みらいです。よろしくお願いします。
ECMAScript6では、`````という符号が導入された。上記の例をECMAScript6で書くと下記のようになる:
var name = "みらい";
var greeting = "よろしくお願いします。";
console.log(`${name}です。${greeting}`);
// みらいです。よろしくお願いします。
このような記述方はPHP、RubyやScalaにもすでに存在しているが、今のJavaScriptにはまだない。
そして、気になるのは、なぜECMAScript6が他の言語にあまり使われてない記号`````を起用したのか。この記号を使うメリットは**、'
(シングルクォテーション)と"
(ダブルクォテーション)も気にせずに構文の中に書けるというとこ**。そして、Markdownに馴染んでるプログラマーにも優しいと思う。
引数
ECMAScript6では引数にデフォルト値が指定できる:
function sayHello(name, greeting = 'こんにちは') {
console.log(`${name}「${greeting}」`);
}
sayHello('みらい');
// みらい「こんにちは」
引数の数が不定の場合は、...
を使うと、一個目以降渡された引数は配列として渡される:
function sum(a, ...b) {
var count = 0;
b.forEach(a => count+=a);
return a+count;
}
console.log(sum(1,2,3,4,5,6)); // 21
ジェナレーター(Generator)
Generatorの導入で、ロープ処理はかなり便利になる。
function* fibonacci()
{
let [prev, cur] = [0, 1];
for(;;) {
[prev, cur] = [cur, prev+cur];
yield cur;
}
}
let all = fibonacci();
// all.next()は{value:<value>, done: <bool>}というオブジェクトを返す
console.log(all.next().value); // 1
console.log(all.next().value); // 2
console.log(all.next().value); // 3
console.log(all.next().value); // 5
console.log(all.next().value); // 8
console.log(all.next().value); // 13
console.log(all.next().value); // 21
console.log(all.next().value); // 34
var output = [];
for (var n of fibonacci()) {
if (n > 100) break;
output.push(n);
}
console.log(output.join(', '));
//1, 2, 3, 5, 8, 13, 21, 34, 55, 89
まとめ
ECMAScript6をサポートしているブラウザやプラットフォームはまだ少ないんだが、いつかJavaScriptに移行することは確信できる。自分はこの数日間ECMAScript6を試したところ、JavaScriptも関数型プログラミングに向いてるのでないかと思った。では〜
今すぐECMAScript6を使いたいという方は、ECMAScript6のコードを書いて、
babel.js
を利用してJavaScriptにコンパイルすることができる。