📚

TypeScript学習の副読本リンク集

2022/11/18に公開

いまやフロントエンド業界では当たり前となっているTypeScript。
勉強する方法、いろいろあると思います。

僕自身は「TypeScript Deep Dive 日本語版」というサイトを中心に学習を進めています。

TypeScript Deep Diveとは？

TypeScriptを体系的に学習できる本のような構成のサイト。
上記リンクは本家TypeScript Deep Diveの日本語訳バージョンで、たくさんの人たちの協力のもと翻訳されているため、日本語として読んでて違和感が少なく初学者にオススメです。

サバイバルTypeScriptも純日本産の学習リソースなのでオススメです。（まだ工事中の項目もあるようです）

しかし、こうしたサイトや書籍で学習していて、「サラッと書かれているのに理解が難しいよぅ…」 な内容もある（主観）と思います。

そんな人（僕）に向けて、TypeScript学習の補足や深堀りに役立った記事を紹介します。TypeScript学習のお供にお使いください。

default exportを使うべきでない理由

以下の記事で、default exportが嫌われる理由を具体例で深堀りできます。

■ひとことまとめ
理由はimport側で自由に名前を変えられてしまうこと と、エディタの補完が効くことによる開発体験の向上 。

型を定義するだけのファイル.d.tsってなんぞや？そもそもアンビエント宣言って？？

■ひとことまとめ
.d.tsファイル内で 「ここに書いてある変数がプロジェクト内で使われますよ～（アンビエント宣言）」 と言っておくと、プログラム内に宣言なしに出てきた変数にコンパイラがびっくりしない。

―文末にセミコロン(;)をつけるべきか否か―

JavaScriptの文脈で古来からあるこの戦争、当然スーパーセットであるTypeScriptでも脈々と受け継がれていくことでしょう。~~（筆者がこのタイミングで改めて気になっただけ）~~

以下の2つの記事をベースに考えてみました。

セミコロンを省いたときに、ASI(JSのセミコロン自動補完機能)でうまくいかない例が数パターンあります。
なので、それらは押さえておく必要がありそうですが、ざっと見た感じ、「とはいえセミコロン無しでも大丈夫では？」 と思ってしまいました。

セミコロン無しの場合に気を付けるのは以下の点でしょうか。

…って、「そもそもそういう書き方ってどうなの？」という自分であればよい、という（強引）。

例えば['a', 'b', 'c'].someFunction()の行を書きそうになった時に、「命名はめんどいけどメンテのこともあるし配列は変数化するかぁ」 と思うようにすることで対処できそうな範囲かなと。おまけにメンテナンス性を高める圧にもなりそうですし。

結論は、、、ありふれたものですが、、、どっちでもよいが、統一しよう で許してください。
いずれにせよ、TypeScript(JavaScript)と長く付き合うならASIの仕様について理解する必要はあるので、両刀使いになるべし ということで。

…俺たちの戦いはこれからだ！！！

型についてちょっとわかってきたタイミングで、関数の引数として渡すときに型定義でつまづく…あるいはデフォルト値ってどうやって定義するんだっけ…？というときに重宝する情報。

筆者もまだ序盤しかじっくりとは読めていませんが、かなり詳しく書いてくださっているみたいなので、腰を据えて復習したいと思います。