TypeScriptのベストプラクティスを見てみる #1

github.com

今回はTypeScriptのベストプラクティスのソースをみつけたので、自分なりにまとめていこうかなと思います。 全体の内容は50個と結構多めなので数回に分けていきますー

JavaScriptのスーパーセットであるTypeScriptを使えば、コードの品質も開発効率もグンとアップしちゃいます。でもって、ベストプラクティスをしっかり守ることが、堅牢でメンテナンスしやすいコードベースを作るコツだったりします。ってことで、今回は5つの重要なTypeScriptのベストプラクティスについて、ざっくりと見ていきます。

1. コーディング規約を守るべし

統一されたコードベースを維持するためには、コーディング規約を確立して守ることが肝心です。リンターやフォーマッターなんかのツールを使えば、プロジェクト全体で一貫性と可読性を保てます。チームごとにカスタマイズした、動的で適応性の高い規約を使うのがベストって感じっすかねー。

2. テストは大事!

コードの信頼性を確保するには、テストを書くのが絶対条件。TypeScriptをがっちりサポートする、総合的なテストフレームワークもいっぱいありますから、新しい機能やモジュールは全部テストしちゃいましょう。リリースよりもテストを優先することで、将来の問題を防いでコードの整合性を維持できるってわけ。

3. 厳格な設定を心がけよう!

TypeScriptの厳格な設定オプションを適用することで、緩い型付けや潜在的なエラーを防げちゃいます。strictnoImplicitAnystrictNullChecksなんかの重要な設定を有効にすれば、厳密な型チェックが行われて、より予測可能で安全なコードになるってもんです。

例えば、tsconfig.jsonでこんな感じに設定します:

{
  "compilerOptions": {
    "strict": true,
    "noImplicitAny": true,
    "strictNullChecks": true
  }
}

こうしておけば、TypeScriptがガッチリと型チェックしてくれます。

4. anyは避けて、しっかり型付けしよう!

anyを使うよりも、明示的な型を使うことでコードの明確さと安全性がアップするんですよね。明示的な型付けをすれば、コンパイル時にエラーを捕捉できるので、リファクタリングもより簡単で信頼できるものになります。tsconfig.jsonstrictモードを有効にして、包括的な型チェックを行うのがオススメとのこと。

anyを使っちゃうとこんな感じになっちゃいます:

let value: any = "hello";
value = 42; // no error, but this is probably a mistake!

でも、しっかり型付けすればこんな風にエラーを捕捉できます:

let value: string = "hello";
value = 42; // error: Type 'number' is not assignable to type 'string'.

型付けは面倒くさいって思っちゃいますが、長い目で見れば絶対に役立つんで、頑張って型付けしていきたいところ。

5. 文字列は安全に!

特定の文字列値しか取れない変数については、ユニオン型を定義して可能な値を制限しちゃいましょう。このプラクティスを守ることで、コンパイル時にエラーを検出できて、不正な文字列の代入を防げるので、コードの安全性が高まります。

例えば、こんな感じで特定の文字列だけを受け入れるユニオン型を定義できます:

type Color = "red" | "green" | "blue";

let favoriteColor: Color = "red"; // OK
favoriteColor = "yellow"; // error: Type '"yellow"' is not assignable to type 'Color'.

こうしておけば、favoriteColorには"red""green""blue"以外の文字列は絶対に入らないって保証できるわけです。これで安心して文字列を使えます。

今回は5つでしたが、次回以降はもうちょっと多めにまとめていきます。