これ行って来ました。

楽しかった!

JavaScript (JS)とECMAScript (ES)の違いとか、そういうのはググってください。

メモ

  • Firefox Auroraが現状ES6最先端ぽい。次点Chromeは
    chrome://flags
    から「JavaScript の試験運用機能を有効にする」を有効にして再起動でES6の機能が使えたりするらしい。
  • Firefoxで
    メニューのツール>Web開発>スクラッチパッド
    でスクラッチパッド。なんかコンソールより便利なやつ。
  • 配列内包表記も使えるように。でも見づらいので三項演算子(?:演算子)みたいな扱いになりそうに思った。

サンプルコードいろいろ

let

ブロックスコープになる。varと有効範囲が異なる。

let x = 0;
if (1) {
  let x = 1;
  console.log(x);  // => 1
}
console.log(x);  // => 0
var x = 0;
if (1) {
  var x = 1;
  console.log(x);  // => 1
}
console.log(x);  // => 1

const

定数を宣言する。定数は再代入が無視される。

const x = 123;
console.log(x);  // => 123
x = 234;
console.log(x);  // => 123 (!=234)

ただし’use strict’を書いてstrictモードにしておくと、 “Exception: x is read-only” といわれる。ふむふむ。

'use strict';
const x = 123;
x = 234;  // => Exception: x is read-only

ヒント: constを試して “Exception: redeclaration of const” と言われたら、
メニューの実行メニュー>変数をリセット
で変数を初期化する。件のエラーは、constで二度宣言しようとしているため。(一度目の実行状態が残っている。)

分割代入

配列の一部を、複数の変数へ代入するってのを一発でやる記法。

// 変数から
var [a,,c] = [1,2,3];
console.log('a', a);  // => 1
console.log('c', c);  // => 3
// オブジェクトから
var {x,z} = { x:123, z:345, y:234 };
console.log('x', x);  // => 123
console.log('z', z);  // => 345

var [x,y] = position;とか良さそう。

もっと複雑なのも。

var [x,{y}] = [{x:123}, {y:234}];
console.log(x,y);  // => {x:123}, 234
var arr = [{x:123}, {y:234}]
var [x,{y}] = arr;
console.log(x === arr[0]);  // => true

関数の引数に初期値を与える

// 引数の初期値
function f(a=123, b=234) {
  console.log(a, b);
}
f();  // => 123 234
f(987);  // => 987 234
f(987,876);  // => 987 876
// 引数がundefinedだと初期値、nullならnull
function f(a=123, b=234) {
  console.log(a, b);
}
f(null, undefined);  // => null 234

可変長引数

argumentsは遅いので、こちらを使おう!という話らしい。

// 可変長引数
function f(x, ...args) {
  console.log(x, args);
}
f(1,2,3);  // => 1 [2,3]

MapとかSetとか

// Map
var map = new Map;
map.set('x', 123);
console.log(map.get('x'), map.get('y'));  // => 123 undefined

MapとObjectの違い:

// Set
var set = new Set();
set.add(10);
console.log(set.has(10), set.has('10'));  // => true false
// Setは+0と-0も区別する
var set = new Set();
set.add(0);
console.log(set.has(+0), set.has(-0));  // => true, false

WeakMap使用場面例:

  1. コンストラクターCでインスタンスo生成時に、WeakMap mへ格納しておく。
  2. mがoを持っていれば、oはCのインスタンスである。(手でプロパティを操作しても判断できる。)
  3. 通常のMapと異なり、oはGCに回収され得る。

イテレーター系

// イテレーター (for-of)
var map = new Map();
map.set('a', 123);
map.set('b', 234);
for (var [k,v] of map) {
  console.log(k,v);
}

通常のオブジェクトはイテレーターに対応していない。

var map = {
  a: 123,
  b: 234
};
for (var [k,v] of map) {  // Exception: map is not iterable
  console.log(k,v);
}

ただし、自前でiterator()を実装すれば利用可能とのこと。

クラス

話題の。

それでもESはprototypeベースであり、classは糖衣構文にすぎない、つまり既存の記法で置き換え可能であるらしい。

楽しかった!

なんかヘンテコな記法が増えたりしてないみたいで良かった。(|>とか……。)

今後が楽しみです。