オライリーの『初めてのJavaScript 第3版』1 を読んだ。
JavaScript をよく分かっていなかったので、ECMAScript 2015 (ES6) を一通り体系的に学べて良かった。
JavaScript 本だとオライリーのサイ本こと『JavaScript 第6版』が有名だが、ES6 非対応なので、同じくオライリーで ES6 対応の『初めてのJavaScript 第3版』を読んだ。
以下、簡単にメモ。
- 全てはオブジェクト(キー・バリュー)
- メソッド:オブジェクトのプロパティとして指定される関数
- class 構文によりクラスベースの OOP が可能
- 内部的にはプロトタイプベース(プロトタイプチェーン)だが、コードを書く際はクラスベースのつもりで書けば良い
- class 構文は関数によるクラス定義のシンタックスシュガー
- 非同期処理は新しい順に async/await (ES7) → ジェネレータ (ES6) → Promise (ES6) → コールバック
- コールバックで複雑な非同期処理を実装するとコールバック地獄に
- 新しい構文により複雑な非同期処理をシンプルに書ける
- async/await が使える環境ならこれを使うのがベスト(?)
- ジェネレータは直感的に分かりにくい
'use strict';
でエラーチェックが厳しくなり good
typeof null === 'object'
- メソッドの
function
と :
を省略可(ショートハンド)
const taro = {
name: 'Taro Yamada',
greet() { console.log('Hello!') }
}
- アロー関数(ラムダ式的なやつ)は this を束縛しない(語彙的に束縛する)
'use strict';
this.val = 'global';
const fGlobalDef = function() { console.log(this.val); };
const ArrowFGlobalDef = () => console.log(this.val);
const obj1 = {
val: 'obj1',
fMethod() { console.log(this.val); },
ArrowFMethod() { (() => console.log(this.val))(); },
fGlobal: fGlobalDef,
ArrowFGlobal: ArrowFGlobalDef
}
const obj2 = {
val: 'obj2',
fMethod() { console.log(this.val); },
ArrowFMethod() { (() => console.log(this.val))(); },
fGlobal: fGlobalDef,
ArrowFGlobal: ArrowFGlobalDef
}
obj1.fMethod();
obj1.ArrowFMethod();
obj1.fGlobal();
obj1.ArrowFGlobal();
obj2.fMethod();
obj2.ArrowFMethod();
obj2.fGlobal();
obj2.ArrowFGlobal();
ちなみにこちらは未読だが、技術評論社の『改訂新版 JavaScript 本格入門』も似たコンセプトの本だと思う。
TypeScript などの AltJS や Vue.js などのフレームワークも勉強したいが、とりあえず次は『CSS3 開発者ガイド 第 2 版』2 で CSS をお勉強します。