職場では正社員にバックエンド専門やPL的な立ち位置の方が多いことからバックエンド〜フロントエンドまで務められるようになることが期待されてます。
私の学習歴的にはバニラJSで止まっているので、TypeScriptのキャッチアップをしていきます。いわゆるブルーベリー本です。TypeScript入門の鉄板というべき書籍にお世話になります。
TypeScriptとは
TypeScriptはJavaScriptベースの高級言語で、JavaScriptに静的型システムを導入した言語。この型が便利でTypeScriptはそこかしこで使われている。
反対に型以外の部分は初期実装された部分を除いてJavaScriptそのものという作りになっていて、このシンプルさがウケている要因の一つといえそう。
function repeatHello(count:number): string{
return"hello".repeat(count);
}
console.log(repeatHello(10));
これはTypeScriptのコードですが、途中で書かれているnumberやstringが型と呼ばれるもの。
型は書いても書かなくてもJavaScriptに変換されてランタイムするのでTypeScriptは漸進的に導入しやすいというのも特徴の一つだと思う。ここは個人的な意見。
実際に学習してみるとこの書籍の特徴かわかりませんが、JavaScriptの仕様をTypeScriptとして解説してる感じなので、これからJavaScriptやTypeScriptを学ぶ人はTypeScriptから入ってしまって良いように思いました。
まあ、それはそれでコンパイル不要な開発環境だとTypeScriptが使えないので苦労する側面もあるかもですが。(Rails7のimportmap構成はTS不可だったり身近に例がある)
型
型とは変数や式が持つもので、文字列や数値といった値のカテゴリーを表したもののこと。
これがあると何が嬉しいかというと、その変数になんの型の値が入らなければいけないかを示す型注釈や、TypeScriptが変数などの型を決めてくれる型推論が機能してランタイム前にバグに気づいたりすることができます。 また、コードがそのままドキュメント的に読み取りやすくなるのも型のメリットです。
型付きの変数代入は以下のように行います。stringの部分が型ですね。
const str: string = 'foobar';
こうやって型を指定するとString型以外を代入しようとするとコンパイルエラーになります。
// これはエラー const str: string = 123;
VSCodeなんかでコーディングしてたら静的解析で常に不適当な値かどうかを指摘してくれるようになるので、まあ便利そう。 型情報が入力補完の精度を挙げてくれるなんてメリットもあります。
トランスパイル
トランスパイルはコードの変換処理のことです。
TypeScriptにはtscというコンパイラが搭載されていて、これでTypeScriptからJavaScriptに変換されてブラウザに解釈されます。このとき行われるのは型注釈を取り除くのみです。
あくまでTypeScriptそのものがブラウザで表示されるわけではないっていうのがポイントですかね。
余談
Railsは開発をより手軽にしていく方向性を取っていて、ビルドのいらない開発環境も作れるけどTypeScriptみたいなコンパイルが必要なやつは使えなくなってしまったり。正直、Railsのビルドいらない構成はニッチな感もありますが。
初学者向けにTypeScriptとJavaScriptをほぼ同一視してくれてるとは思うんですが、ここまでくるとJavaScriptにTypeScriptが合流してくれたほうが色々シンプルになって皆さん楽では？と思ったりもしますが、どうなんでしょう。
