JavaScript入門書のJavaScript Primerのウェブ版をアップデートして、2021年の最新の仕様であるES2021に対応しました。 JavaScript Primerのウェブサイトから閲覧できます。

JavaScript Primerについて

JavaScript Primerは、これからJavaScriptを学びたい人が、ECMAScript 2015以降をベースにして一からJavaScriptを学べる書籍です。 ECMAScriptの仕様は毎年アップデートされるため、JavaScript Primerも毎年それに対応できるように継続してアップデートしています。

GitHubで更新情報を購読したい人は、asciidwango/js-primerリポジトリを“Watch”してください。 “Custom”からリリースのみを購読も可能です。

GitHub Watchesの登録画面

更新通知をメールで受け取り方は、次のフォームからメールアドレスを登録してください。

今回のアップデートのような大きめな更新情報をメールで受け取れます。

書籍への支援について

継続的にアップデートするために、書籍への支援はいつでも歓迎しています。 JavaScript PrimerはECMAScriptのアップデートに追従したり、現実の使い方を反映するために、継続してアップデートしています。

GitHub Sponsorsで著者を支援できます。

また、書籍版へのレビューを書くことも支援に繋がります。

GitHubのDiscussions（掲示板）の他の人の質問に答えたり、JSPrimerを読んだ感想を書くことも支援になります。

Discussionsのガイドラインは次のスレッドにまとめられています。

書籍に対してIssueを立てたり、Pull Requestを送ったりして直接的に支援もできます。 IssueやPull Requestについては、次のページを参照してください。

ECMAScript 2021について

The 121st General Assembly held as a virtual meeting on 22 June 2021 approved the following documents:

ECMA-262 12th edition – ECMAScript® 2021 language specification – https://www.ecma-international.org/news/ecma-international-approves-new-standards-4/

ECMAScript 2021は、2021年6月22日にEcma Internationalで正式に承認された仕様です。 ECMAScriptは、日々アップデートされるLiving Standardであるため、現時点の最新のものはhttps://tc39.es/ecma262/で公開されています。 一方で、毎年6月ごろにLiving StandardのスナップショットとしてECMAScript 20XX(西暦が入る)がEcma Internationalから公開されます。

ECMAScriptの仕様策定のプロセスについては、次のページを参照してください。

ブラウザやNode.jsなどがどのECMAScriptバージョンに対応しているかは次のサイトで確認できます。 ブラウザやNode.jsの最新のバージョンはECMAScript 2021に対応しています。

JavaScript Primer 3.0では、ECMAScript 2021で追加された要素に対応しています。

JavaScript Prime 3.0.0の変更点

ウェブ版のJavaScript Prime 3.0.0では次の項目について書籍の内容を変更、追加しています。

2.0から3.0までのコミットは次のURLで確認できます。

String#replaceAll

ES2021では、String#replaceAllメソッドというマッチした文字列を全て置換するメソッドが追加されました。 String#replaceメソッドは、最初に一致したものだけが置換されますが、String#replaceAllメソッドでは一致したものがすべて置換されます。

今までもString#replaceメソッドと正規表現のg（global）フラグを使うことで、繰り返し置換が可能でした。 しかし、正規表現では?や.などは特殊な意味を持つため、エスケープが必要となります。 String#replaceAllメソッドでは、ただの文字列として渡したものを繰り返し置換ができるため、エスケープが不要な点が主な違いです。

const str = "???";
// replaceメソッドの場合は、正規表現の特殊文字はエスケープが必要となる
console.log(str.replace(/\?/g, "!")); // => "!!!"
// replaceAllメソッドでは、文字列として渡した検索文字列を全て置換する
console.log(str.replaceAll("?", "!")); // => "!!!"

詳細

Numeric Separators

ES2021では、Numeric Separatorsという_を数値リテラルの区切り文字として利用できる構文が追加されました。

数値リテラルでは数値が大きくなるほど、桁数の見間違いなどが発生しやすくなります。

const largeNumber = 1000000000000;

Numeric Separatorsでは、数値リテラルの区切り文字として_が追加できます。 数値リテラルを評価する際には、_は単純に無視されるため意味の違いはありません。

const largeNumber = 1_000_000_000_000;

Numeric Separatorsの解説をデータ型とリテラルに追加しています。

また、ビット演算では数値リテラルの桁数が多くなりやすいです。 そのため、演算子のビット演算のセクションをNumeric Separatorsを使って大幅に書き直して、図などを追加しています。

ビット演算のセクション

📝 演算子の章は肥大化しやすいので、今後のバージョンで整理するかもしれません。 ビット演算はユースケースでは利用していないため、ページとして分ける可能性もありそうです。

チートシートのES2021の対応

チートシートにES2021で増えた構文を追加。

  • Numeric Separators

含まれなかったES2021の変更点

次のES2021の変更は、現時点のJavaScript Primerでは含まれていません。 JavaScriptのリファレンスを作ることは本書の目的ではないため、 書籍のユースケースで利用する可能性が少ないものに関しては取り入れていません。

詳細はES2021の対応 · Issue #1220 · asciidwango/js-primerを参照してください。

ES2021で追加された機能や構文をすべて確認したい場合は、次の記事を参照してください。

📝 Promise.any と AggregateErrorについてはJavaScript Promiseの本で取り扱う予定です。 Promise本もそうですが、追加したい項目は色々あるので、一緒に書いてくれる人はいつでも募集しています。

また、AggregateError はPromise関係なく、複数のエラーをまとめたエラーを扱う方法が標準化されているので今後重要になる可能性があります。 現時点ではStage 3のProposalであるError Causeでエラーのコンテキストを継承できるようになるため、例外処理 · JavaScript Primer #jsprimerは変わるかもしれません。

その他の修正