はじめに
オライリー社の「ハンズオンJavaScript」を読みながら、気づいたことや、重要と思われるポイントをメモしていきます。
また、出版から5年ほど経っているので、古くなってしまったり、動かなくなった内容があれば、指摘していきます。
第1章は、「学び始めるまえに」です。
私の動作環境
- MacBookAir (Apple M1)
- GoogleChrome (Ver.141)
本はepubファイルで、macOSの「Books」アプリで表示しています。
この本を選んだ経緯
今年の終わり頃に、以下のJavaScriptの資格を取ろうと決めました。
せっかく勉強するのであれば、ただの試験対策だけに留まらず、手を動かしながらJavaScriptを体系的に学習したいと思い、様々な教材を比較検討して、本書に辿り着きました。
本書の「まえがき」では、主なターゲットが「完全なプログラミング初心者からプログラミングの初級者」と書いてますが、オライリーの以下のページでは「Intermediate To Advanced」(中級者〜上級者)との記載がありました。ざっと眺めた印象としては、そこそこ深いところに踏み込んでいるので、中級者以上の方(目指す方)でも十分役に立つ内容と思われます。
手を動かして学ぶことに、こだわらないのであれば、以下の教材などもあります。
それでは、次の見出しから、メモを記載していきます。
JavaScriptの価値
他言語と比較した時のJavaScriptの特徴について書かれてあります。
本書の内容と一部重複しますが、私が思うJavaScriptの優れている点は以下の通りです。
- 環境構築が容易
- 事前に何かをインストールすることなく、Webブラウザ(厳密には開発者ツール)から、コーディングと実行が可能
- 汎用性の高さ
- Webのフロント、バックエンド(Node.js)、スマホアプリ(React Native)、GUIプログラム(Electron)、CUIプログラム(Node.js)など、1言語で多くの形態のプログラムを作成することが可能
- 人気度・知名度・普及度が低くない点
- プログラミング言語の人気ランキングで、そこそこの順位をキープ
Chrome DevTools の Lighthouse
各機能(タブ)の大まかな説明がされています。
普段は、「Elements」と「Console」、時々「Network」と「Application」くらいしか使っていないのですが、「Lighthouse」という機能を使うと、描画のパフォーマンスや、アクセシビリティに対して、客観的な評価を行うことができます。
ブラウザ上で複数行のコードを実行
Consoleのところで、「Shift」を押しながら「Enter」キーを押すと、コードを書いている途中で改行ができます。これでifやforが書きやすくなります。

1次元オートマトン
1次元セルオートマトンのソースコードの例が書かれてました。
聞きなれない単語でしたが、どうもセルが並んでいて、セルごとにON(黒)かOFF(白)が設定されており、次のタイミングで、あるルールに基づいてONとOFFの状態が変動するプログラムのようでした。
本書の例は、あるセルが次にONになるかはXORで判定しているようでした。(あるセルがONなら、次はそこがOFFになり、両隣がONになる。)
DevToolsのブレークポイント機能を使うことで、オートマトンの描画を1行ごとに確認することができました。
