[書評]「ステップアップ JavaScript ~フロントエンド開発の初級から中級へ進むために~」はなんとなく書いているJSの知識を整理するのにお勧めの一冊

こんにちは！

あけましておめでとうございます。@tatsushim です。最近はJavaScriptとSolidityを書いています。

実は去年、尊敬するプログラマの一人である @ms2sato さんから、執筆中の書籍についてレビューの依頼いただきました。
校正などをお手伝いさせていただいく中で、都度ググって見つけたソリューションの組み合わせでなんとなく書いていたJavaScriptの知識を整理するのにとても良い書籍だなと感じました。
せっかくなので、感想とともにどんな人に向いているかをこの記事でお伝えしたいなと思います。

ざっくり感想

自分のJavaScriptの学び方を振り返ると、「JavaScriptを学ぼう！」と思って勉強したというよりは、流行りのフレームワーク（当時はjQuery, Backbone.jsで今ならReact）を用いてアプリケーション開発を進めながら学んでいきました。
JavaScriptは良くも悪くも検索して見つかるブログ記事やStack OverFlowなどのサンプルコードの切り貼りで動いてしまう部分があるので、その場の問題は解決できました。
一方でその場限りの理解が多かったために、非同期処理（async/await、Promise）やthis、スコープといったトピックには、何度かハマりました。
本書はそのような「とりあえず動くJavaScript」を卒業するため知識が詰まっており、それらを整理して効率的に学べる内容となっていると思いました。

図を用いた同期・非同期に関する丁寧な説明

逆に、上記のようなキーワードを掘り下げられる知識がある方にとっては、すでに理解されているものが多く、より上級者向けの書籍を選択された方が良いかもしれません。

本の構成 (目次)

全10章の校正になっており、一方的に知識が述べられているというよりは、実際のアプリケーションをつくりながら解説が進んで行くので、とても理解しやすかったです。

下記公式サイトより目次を抜粋します。

ステップアップ JavaScript - Books of CIRCLEAROUND

■ はじめに
■ ステップ0 肩慣らし
 └ JavaScript の操作の基本を確認する
 └ JavaScript で表示を操作する
 └ JavaScript で複数の要素を操作する
■ ステップ1 動くアプリケーションを作ってみる
 └ 仕様の確認〜簡単な動作確認をしよう
 └ 経過時刻をカウントし、見た目を整えよう
 └ カウント停止を実現し、バグに対応しよう
 └ ドンドン増えるログを出してみよう
 └ リファクタリングして柔軟性を上げよう
 └ DOM（Document Object Model）の概念を知ろう
■ ステップ2 ES6を学習する
 └ JavaScript のバージョンについて
 └ ステップ1のアプリケーションをES6対応にリファクタリング
 └ クラスについて知ろう
 └ ステップ1のアプリケーションにクラスを適用する
■ ステップ3 ES6で書いてゆく
 └ 仕様の確認〜画像を一枚表示しよう
 └ 複数画像を順番に表示できるようにしよう
 └ 画像を自動で更新し見た目を整えて完成
■ ステップ4 押さえておくべきJavaScriptの言語特性について
 └ スコープ
 └ 等価演算子（==）と厳密等価演算子（===）
 └ this
 └ undefined
■ ステップ5 Node.jsとnpmを知ろう
 └ Node.jsとは
 └ npmとは
 └ Node.jsのインストール
 └ npmパッケージを導入する
 └ http-serverを起動する
 └ ローカルインストールについて
■ ステップ6 AJAXを使ってみよう
 └ AJAXとは
 └ JSONに触れてみよう
 └ AJAXを体験してみよう
 └ サンプルアプリケーションを作成してみよう
 └ コードをリファクタリングしてみよう
 └ CORSについて
■ ステップ7 その他のJavaScriptの特性
 └ 無名関数
 └ 即時関数
 └ クロージャ
 └ 例外
 └ プリミティブ型／オブジェクト型と参照
■ ステップ8 非同期処理について知ろう
 └ 同期・非同期
 └ async/await
 └ Promise
 └ 非同期処理でよくある悩みへの対応
 └ 課題
■ ステップ9 トランスパイル 〜レガシーブラウザへの対応〜
 └ トランスパイルとは
 └ トランスパイラを導入してみよう
 └ トランスパイルを実行してみよう
 └ Polyfillについて
■ ステップ10 総合演習
 └ 仕様の確認 〜クイズデータ取得と確認
 └ 各画面を作成しよう
 └ クイズを表示しよう
 └ クイズの正解率を集計しよう
 └ 解答に制限時間を設定してみよう
 └ 見た目を整えて完成
■ 付録
 └ A コードがうまく動かない時・デバッグについて
 └ B 知っておくべき知識
 └ C 非同期処理の歴史

どんな人に向いているか

一言でいうならば、「今まではなんとなくJavaScriptを書いていたが、今から正しい知識を身に着けたい」という方に向いています。
より具体的には

・ある程度直感的にJavaScriptを扱えるけれども、掘り下げるとよくわからなくなってしまうようなものがある方
・今までググりながら都度問題を解決してきたが、JavaScriptに関して体系的に学んだことがない方
・メインはサーバーやインフラのエンジニアリングだが、今後はフロントエンドもしっかり書いていこうと思っている方

といった方々です。

おわりに

正直、もっと早いタイミングでこの本に巡り会えていれば、検索をしながら苦労して理解を進めたステップをショートカットできたろうなと思いました。
第一章にあたる「はじめに 〜 本書の読み方」が公式のサポートサイトにて公開されています。初級者から中級者のフロントエンドエンジニアの方で興味のある方は一度ご覧になってみることをオススメします！

はじめに | ステップアップ JavaScript - Books of CIRCLEAROUND