Exploring ES6

[karino2]

あらすじ

なんだかんだでちょっとしたJSを書く機会が無くならないので、雑用を楽に書く為にES2015の便利機能も使いたいな、と思うようになる。 AndroidとPCの最新のChromeで動けばもう使ってもいいか、という感じなので。

MDNを見つつアロー演算子やfor of、テンプレートリテラル、destructuringあたりは使っていて、結構便利だな、と思ってた。ここらで一通り他の事も知っておいても良いかな、という気分になる。classと以前のコンストラクタやprototypeとのインターオペラビリティとか、generatorとかをちゃんと知りたい。 ただ趣味でちょっと書く程度なので、本気でスペシャリストになる気は無い。 古いブラウザとかBabelとかは全然興味無い。

自分は古い話になるがECMAScript 3は業務で使ってたレベルでプロフェッショナル。 なので、それを前提に、新機能についてちゃんと解説されてる本は何か無い？とomo先生に聞いたら、あんま詳しくないがExploring ES6とかどうなんだろう？と言われた。
web版をチラチラ読んだら悪く無さそうなので、epubを買って読む事に。

以前はpdfにこだわってたが、最近はepubもコード引用とかも結構まともに書かれるようになったし、久しぶりに起動したらPlay Booksも大分良くなってたので、読むのはepubでいいかなぁ、という気分に。一応pdfもダウンロードしておくが、多分見る事は無い気がする。

ページ送りとかが早いの大切だよねぇ。Perfect Viewerとかそろそろ辛い。誰か直さないかなぁ。forkしようかなぁ。でもなぁ。まぁいい。

[karino2]

第一印象

最初ES6というタイトルだったのでES2015という名前になる前の本なのかと思ったが、ES2015の名前が言及されてるので、ES2015を知りたいという自分にも問題無いらしい。よしよし。

[karino2]

第一章、バージョンの話

JScriptやJScript.NETまでは触ってたので、その後ES4がどうなったのかとかは興味はあったが全然知らなかったので、なかなか面白かった。

ただこういうのにはあんま深入りしたくないね。自分はもうwebの人じゃないので、ES2015を使う、過去の事はまぁどうでも良い、というスタンスを取りたい。

ただこの章、良く書けてるね。

[karino2]

3章 One JavaScript

2章はFAQであまり得る物無しなのでこのブログ的には飛ばして三章。

strictで何が起こるのかちゃんと見たのはこれがはじめてかも。

バージョニングはES4の失敗をリアルタイムで見てたので「分かるわー」という印象が強い。ただdeprecated にしていく事は出来ると思うけどね。

[karino2]

mobiでKindleも悪くないかも

フランス語でそろそろ使うかもしれないから、という事で久しぶりにpaperwhiteを取り出した。

で、ES6本もKindleで読みたいな、という事でmobiを送ってみた所、結構普通に読める。 コメントとかの色違いは見づらいが、そのくらいなら我慢も出来るし。 なんか画面のロックとかも無いし、バッテリの保ちがいいからつけっぱでもいいか、と思えるので、結果としてすぐ読めるのだよな。 それが気分良さにつながってる。

[karino2]

4章 Core ES6 features

良く使うES6の新機能を簡単に説明した章。 むしろここだけでいいんじゃね？という位良く書けている。

spread operatorって使った事無かったので、この機会に覚える。11.8に詳細があるとの事なのでリンクを辿って一通り読む。ふむふむ。

classのあたりも15章のリンクを辿って読む。どういうprototypeに翻訳されるか、とかもちゃんと書いてあって、まさに自分が読みたかったあたりなので満足。良い本だね。

[karino2]

4.18でmoduleがブラウザでは使えない、となってるが、ググったらimportとexportは最近のブラウザならどれでも動きそうだな。 よしよし。

[karino2]

4章は素晴らしいな

読み終わったので感想とか。

ES6を知りたい、という人がどういう人かを良くわかってる本になっていて素晴らしい。

ES5についてはある程度の専門的な知識をちゃんと前提として書いてくれているので、知りたい所がちゃんと簡潔に書かれている。

以前のバージョンのJSを知らない人には真意が分かりづらい所もあるのだけど、ES6をちゃんと知りたい、という人の大多数はES5以前のJSはちゃんと詳しい、という事が多いと思うので、 ちゃんとES6という言語の特殊性を考慮に入れた素晴らしい構成と思う。
普通の言語とはいろいろ違うし、ましてやES6はさらにいろいろ違う。込み入った事態をちゃんと理解したい、と思う時点で、以前のバージョンに詳しいのは現実問題として前提にして良かろう。

実務で急いで使うなら、まず4章読んで、気になった所だけそこからリンク辿って読むだけでも十分かもしれない。

[karino2]

5章 NumberとMathは流し読み

isSafeIntegerの説明で53bitだ、みたいな話を見る。 へー、こんなのも追加されてるのか。 JSは結構書いたが53bit越えて困った事は無いなぁ。

この章の内容はある程度浮動小数点とかのバックグラウンドが無いとさっぱりだろうな。

[karino2]

6章のStringも読み飛ばし

テンプレート文字は8章との事なので、この章は流し読み。tagged templateは初めて知った。

[karino2]

7章 Symbol

シンボルは初見なので真面目に読む。 同じ文字でも別のシンボル作れるのね。 そしてfor inでは表示されないって…

property nameとproperty symbolとかうんざり過ぎる。ES6はこういう言語になってしまったのね。

結果としてkeysではkeysは列挙されずにstring keysだけ列挙されます、とか。これは仕方ないね。

[karino2]

iterable相当をシンボルで実現するのはなるほど、という気がする。 これはJS的やね。なかなか良い。

[karino2]

Symbol読み終わった。 知らない事も多くて勉強になった。

なんかあんまりこういう記述がすっきりしてない言語機能は好きになれないが、 JSがこういうのが必要な段階に来ているというのは分かるので仕方ない。

[karino2]

8章 Template Literalとtagged template

Template Literalは普段から便利に使わせてもらってるが、tagged template literalは使った事無い。 いい機会なのでちゃんと勉強する。

[karino2]

8.3.8のGraphQLの例は良く分からんな。 たぶんRelayを別に勉強する必要がありそうだが、別段興味も無いので分からないままでいいか。

tagged templateはあれば便利かもしれないが、言語のコア機能に要るのか？というのは微妙な所。 DSL作るのに便利だろうが、使われすぎる未来が容易に想像出来る。

[karino2]

8.4のtag functionの実装は良く書けている

rawとcookedが渡されるが、この時テンプレートは毎呼び出しで同じオブジェクトがくる事が保証されるらしい。 良く考えてある仕様だね。さすが。

この辺は今のところ自分で使いたいとは思わないが、有効活用してるコードが流行った時に仕組みを知ってると適応も早いので知っておく価値はある気がする。

[karino2]

8.4.2 tagged template literalのエスケープ

こういうのはちゃんと細かく書いておいてくれるとありがたいね。 この辺よく書けた本だ。

8章読み終わり

8章は読み応えあった。この辺はよく使うので、ちゃんと知っておくモチベーションも高いしね。

そしてこの本は期待に応えて良く書けていた。これだけ良く書けていたら、 遊びで触る程度なら仕様書は見なくてもいいかな、という気がする。 8章を読んで、買って良かったな、という気がした。買うかどうか迷ってる人はweb版で8章だけ読んで判断するのが良いかも。

全体的にES5は知ってる、という前提で進むのだけど、この要求水準が結構高い気がする。 自分がついていけるのだからこの位は要求して良いのかもしれないが、 初めてJSを本格的に勉強してみよう、という人には良く分からない事も多そう（関連するブログなどにはリンクが貼られているので読んで行けば分かるのかもしれないが）。 なんだかんだで自分は昔、仕事で使ってたので、結構細かい事まで知ってる方だと思う。

[karino2]

9章 変数とか

var、let、constは別に知らない事も無いだろう、という気がするが一応読んでおく。

temporal dead zoneという用語は初めて知ったな。

9.5のfor文

varだとアロー関数で全部最後の変数が参照される、というのは罠だなぁ。 そしてletだと毎回別の変数になる。うへぇ。

なお対応するスペックの場所とその解釈が載ってるのは嬉しいね。

[karino2]

9.7 windowのメンバ

Classはwindowオブジェクトのプロパティにはならない！へー。

そしてletも入らないんだね。 こっちはなんか入ってない気はしてたので驚きは無いが。

でも入ったり入りなかったりややこしい言語になったな…

[karino2]

9.8 function declarationはブロックスコープ

へー、そうだっけ。hoistされるからfunction scopeな気がしてたが違うのか。 TDZが無いだけなのね。

それにしても関数定義はwindowオブジェクトに入るがclass定義はwindowオブジェクトに入らないって、凄い言語だな。

classがhoistされないのは有名だが、理由がextendsがexpressionだから、というのはちょっと笑ってしまうな。

[karino2]

9章読み終わり

変な落とし穴はいろいろあるので読む価値はある。 ただあんまりこの辺詳しくなりたいとも思わないので、必読だ！とも思わないが。

本は良く書けているね。スコープの辺知りたい人は必読書と思う。 仕様書も読むにせよ、その前に読んでおく価値はある。

[karino2]

10章 Destructuring

この辺もそんな難しい事は無い気はするが、良く使うので見てはおこう。

[karino2]

curly barceで始められない（シンタックスエラーになるから）と、正規表現のunmatchがnullを返すとエラーになっちゃう、はちょっと驚きがあるが、他の内容は特に意外な事はなし。

最後のフォーマルなアルゴリズムの記述は飛ばす。お仕事で使わない限りはここまで理解せんでも良かろう、という事で。

[karino2]

11章 引数まわり

Destructuringを読んだあとなので、別段分からん事も無さそう。ガンガン読み飛ばす。

名前付き引数もどきを作る時、引数無いとundifinedでToObject失敗するからデフォルトパラメータ作るのが大切だぜ、とかいう記述はうんざり意外の何者でも無いが、あんま使わなければ良い。

Mapにはmap関数無いが配列へのspreadとmapを組み合わせると出来るぜ！とかいうのもうんざりだが、出来ないよりは良い。

一通り読み終わったが、別段たいした内容は無し。10章読んでたらサラッと流すだけでいいね。

[karino2]

12章 callableな物いろいろ

methodとarrowと普通のfunctionの使い分けとかの話だが、これがmethodとかより前にあるのは構成としてどうなのかなぁ。

arrowのIIFE版たるIIAF版でも何故かっこが必要か、という理屈を知るべく、リンクのあるarrow functionの章に飛んで該当場所を読む。 bodyがexpressionの時の最後が関数呼び出しの場合との曖昧さの為か。

IIFEはexpressionでさえあれば呼び出せるので、カッコの終わりは最後でも良かった訳だが、arrowでは駄目になったのね。 まぁこんな詳細の理屈を理解してイキる歳でも無い。

objectリテラルでのメソッド定義はカンマがいるがclassの中のメソッド定義では要らない、とかいうのは、毎回うんざりするな。以前も言った気がするが。 ES6はdepricatedの仕組みも入れておかないと、次のバージョンは作れないと思うんだが、無くて良かったのかなぁ。

nameプロパティの入り方は大分変わってるので教養としては勉強になったが、使わないで生きていきたいものだ。 この本のこういう所の解説は素晴らしいね。

という事で12章読み終わり。 あとの章で解説する内容が多く出てきてこの章自体の内容はそれほどでも無いので、割と微妙な章構成だな。

[karino2]

13章はさきほどリンクをたどって半分くらい読み終わってたのでサクっと読み終わる。13章は同じ事を何度も言ってる気がして冗長とは思うが、読み飛ばせばよろしい。

[karino2]

14章 Object周りの新機能

assignとかで大した話じゃないが、Object.isというのが出来た、というのは笑ってしまった。 なんというか、==と===とObject.isがあってそれぞれ違う振る舞い、とか酷い話だな…

お、setPrototypeOfなんてのが出来たのか。

14.4.1、オブジェクトのプロパティをtraverseする方法は5通りあります、とかいう始まりからして笑ってしまう。 そしてownKeysはObjectじゃなくてReflect！なんで！？

14.4.2 順番の所はわかりにくい説明だが、あとの14.4.2.4を見ると少し意味が分かるな。

EnumerableOwnNamesはObject.keys()で使われてる物で、OwnPropertyKeysはReflect.ownKeys()のspec で使われている物らしい。

justificationの説明はまったく説得力は感じないな。不定なのとrandomとしなきゃいけないのは別の事で、別に不定で良かろう。 ただそうなってる、という事実が全てなので、理屈が納得出来るかはそんな重要では無いが。

[karino2]

objectリテラルの__proto__が標準化されてらっしゃる。へー。 そしてcomputedの場合との謎の挙動の違いが酷い。

deprecated扱いなら、別に標準化しなきゃいいのになぁ。 この辺のセンスは好きになれない。

ただObject.prototypeのsetterとgetterとして定義されてるので、prototypeがnullなら普通のプロパティとして使える、というのはセンスを感じるな。

[karino2]

property descriptorは昔は無かった物なので真面目に読む。

こういうの入り始めるとお手軽言語感は無くなるねぇ。 こんな仕様なのにV8とかバカっぱやいのは、企業が頑張る大切さを感じるな。

toPrimitiveの引数は文字列か。へー。

[karino2]

14章まで読んだ雑感

随分ごちゃごちゃした言語になったよなぁ。 ES-3の頃のEcma-262は短くて簡潔だったのに。 もちろんそのせいでいろいろな問題は出て、それに対する対策なのは分かるのだけれど。

シンプルでは無いが、仕方ない、という気持ちにはなるし、そういう事を全て忘れてちょろっとした事を書くのに便利に使う分にはこれで良い気はする。

本の記述は著者の考えと実際のスペックの間に微妙に乖離がある気がするが、専門家になる気が無いなら受け入れておいて問題無い範囲に思う。

例えば__proto__はdeprecatedだと思って読んでいたが、章の終わりまで読むとそうでも無いんじゃないの？という気はした。 でもどちらにせよそんな深入りしない方がいい所ではある。

一方でこの次の大型バーションアップをこの上にやるのは辛そうね。 ここからはマイナーバージョンアップで余生を送る運命なのか、それとも苦しみを乗り越えてさらなる大型バージョンアップを達成する日が来るのか、野次馬としては興味が沸く。 でもそれが問われるのは、10年後とかだろう。

[karino2]

15章 Class

classがprototypeの上のシンタックスシュガーだというのは良く見かける話だが、実際どういうコードになるのかは良く分かってなかった。

その辺を知りたい、というのが本書を読み始めたモチベーションの一つなので、この15章は期待している。

[karino2]

constructor周辺

thisを触るとReferenceErrorだがreture で別のオブジェクト返す事は出来る、 というのは、なかなかJavaScriptだな。 ES6で初めて学ぶ人からすると意味分からん仕様だろうが。

でもsuperが出来たおかげて大分変なトリックの出番が減ってそうね。

[karino2]

bult-in constructor の継承

おぉ、Errorが普通にサブクラス作ってスタックトレース取れるように！ Array継承してlengthもそのまま使えるとか、分かる人には分かる驚き（笑）

まぁさすがに当たり前ではあるが。

[karino2]

クラスを生成する関数でmixi in

これは勘弁して欲しい感じだな^^;

こういう事やらずに済む範囲でだけ使っていきたいね、自分は。

やんちゃしたい人はexpressionが自由に使えて良かったですね…

[karino2]

declarationでもlexicalなinner nameが！

15.5.3.2のサンプルのコードが予想外の振る舞いだったので驚いた。

これはこれまでのJSの感覚でいるとちょっと驚きだね。 expressionならそうなると思うけれど。

[karino2]

15.6 prototypeチェーン

ここが読みたかった所の核心っぽい。

関数側のチェーンはインスタンスには何か影響はあるのかしら？

で、instance側は、prototypeチェーン的には手でクラスっぽい物作る時と同じやね。素直で良い。

コンストラクタは結構違うね。これは大変更だ…

でnew.targetは普段はようするにnewをよばれたコンストラクタの関数が入ってる訳か。

[karino2]

なんでこんな変更があったかというと、このあとのArrayのサブクラスの話がその答えなのかね。

exotic objectの生成はexoticな方法に任せたいが、自分のprototypeは渡したい、という。

そのあとのHomeObjectのあたりも良く書けているね。なるほど。このスロットを埋める方法は今のところメソッド定義だけなのか。

[karino2]

15章読み終わり

良く書けていた！この本に期待していた事はここだったので、見事に期待に答えた。

ES2015のclassはあんま好きでは無いが、必要なら使おうという気分にはなれる程度の理解は得られた。

ただやっぱいろいろ無理があるよな。 JS的で無いというか。 オブジェクトリテラルの方が好きだなぁ、やっぱ。

そしていろいろな現実とちゃんと向き合った複雑な言語になってしまったね。 現実を生きる我々には良いニュースなのだろうけれど。

[karino2]

16章 Module

Moduleはnode側では見るがブラウザ側ではあんま見かけない印象なのだが、使えるのかしら？

default exportとanonymous declaration

anonymous declarationって使う方法が無いんじゃないか？と疑問に思ってたが、default exportはdeclarationに付くもので、この時はanonymousでも良い、ということか。

この時だけ特別扱いでも良かった気もするが、これで困らんのならこれで良い、という事なのかね。困らないかどうかはちょっと考えたくらいでは分からなかった。

[karino2]

16.3.6.2 cyclic dependencyも解決出来る！

読んでて驚いたが、ES6はunqualified importも間接参照になって、あとで更新されるらしい。 へー。

例がいかにもJSで解決出来無さそうなパターンだったので、ES6のmoduleなら大丈夫、というのを読んで驚いた。

[karino2]

16.4.1 asで名前指定！

えっ！object destructuringと違うシンタックスなの！？なんで！？

16.5. Loaderはブラウザ標準では無さそう？

ちらっとググった範囲ではSystem.importは2018年5月現在でもまだブラウザのビルドインサポートでは無さそう。

なんかあんま読む気無くすなぁ。軽く読み流すか。

[karino2]

モジュールはいまいちな印象（ただ無いよりは良い）

16章を読み終わり、モジュールがどういう物かは分かった。 これが標準として皆が使ってくれたらいいな、とは思う。

ただ凄い良く考えられててその思想に同意する、という感じはあまりしない。 こんな仕組みにしたメリットの幾つかは、別にそれJSじゃなくていいよ、という物だし。 全体的に、いまいちJS的じゃないのだよなぁ。

ただこういう何かは必要で、とりあえずこれで生きてはいけそうなので、 あまり好きじゃないがこれでいいか、という気はする。 多少気に食わなくても、あると無いとでは大違いである。

[karino2]

Part 4、コレクション

コレクションはここまで見てきた内容でだいたい予想がつく事やごく普通の話が多いので、そんなに見る必要も無さそう。 軽く流す。

17章、18章は大した話は無し。

この2つの章はfor ofとArrayの新設のメソッドくらいで、内容は割と普通。

isConcatSpreadなんて物が出来てるのにうんざりしたくらいで、他はどうという事は無い。

19章もsetやmapはlengthじゃなくてsizeだ、という事以外は別段驚きは無い（配列と別なの！？）

[karino2]

20章 TypedArray

TypedArrayは存在は聞いていたが良く知らないので、良い機会とこの章は真面目に読む事にする。

[karino2]

20.2.4 Negative indices

うぉ、TypedArrayのmethodだけあるのかよ。 なんて不格好な言語だ…

[karino2]

20.4.8 constructorがオーバーロードされてる！？

なんじゃこりゃ！？ なんでこれをfactory methodでは無くコンストラクタにしてしまったのか…

さすがにこれはJSとして駄目なんじゃないかなぁ。

[karino2]

20章読み終わり

コンストラクタがオーバーロードされてて第一引数が別の型になるのやめてよって感じだが、他はなるほど、という作りで良さそう。

似たような事はいろいろなスクリプト言語で発生すると思うが、これが答えな気はするデサインやね。 そういう点で勉強になった。

なお、TypedArrayで出来る事は増えるしいろいろやってる人は身近にも見かけるが、本当にそれが価値ある事かは自分はちょっと疑っている。 アプリでええんやないの？という。

ただそういうのは時が証明していくと思うので、こういうの入れていろいろやってみるのは良い話だと思う。 どの旗の下で戦うかは選べる方が良い。

[karino2]

21章のiteratorは読み流す

return なんてものがある、というのを知り、酷い使い方をされそうだなぁ、と思ったくらいで、他は特に分からない事も無し。 常識的な内容やね。

[karino2]

22章 generator

generatorは新しい言語要素なので興味有る人多いと思うのだが、出てくるのが22章というのはさすがに遅すぎじゃないか。 TypedArrayよりは前の方がいいような。

まぁ先頭から順番に読まなきゃいいという事かもしれない。

[karino2]

async, awaitは2017なの！？

ふんふん、と読んでいて一番驚いたのが、 async, awaitはES2017で入る、という話。

え！？asyncって2015で入ってないの！？ 割とみんな使ってたので入ってるのかと思ってた…

普通にChromeとかではasyncもawaitも動いてるからなぁ。

[karino2]

22.4.4 finallyのyield

return()してもfinallyでyieldしてるとdoneにならない、というのを見て、へー、っとなる。

これ、どういう時に必要なんだろう？