TypeScriptの静的型付けを味わってみた

class記述以外のTypeScriptの醍醐味
静的型付けについても調査してみた。

1. そもそも...JavaScriptは動的型付け です！

同じ変数でも途中で型を変えられる

JavaScript

var  x = 10;　// ここではNumber型
x = "hello";　// ここではString型

こういう記述が平気で許される。
この寛容さが良いという人と、嫌いという人がいる。
自分はどっちでもいいんじゃないかなと思ってます。

2. TypeScriptは静的型付け

動的だと一旦、信じて書いてみる

• TypeScriptだと変数の後にコロンとデータ型を書く
• 型推論してくれるので、var x = 10; の書き方でも型付けはできる
• ちなみに var x; とかやるとany型になる

TypeScript

var x: number = 10;
x = "hello"; // 動的に書いちゃったパターン

Let's Compile!!

% tsc main.ts
main.ts:2:1 - error TS2322: Type '"hello"' is not assignable to type 'number'.

2 x = "hello";
  ~
Found 1 error.

"hello" は 'number' 型に割り当てられません! と、しっかり怒られる！

3. 静的に書いてコンパイルする

x="hello";を消してコンパイルすると...

JavaScript (Compiled)

var x = 10;

普通にvarの変数宣言になる。

4. まとめ

• JavaScriptは動的型付け
• TypeScriptで動的な記述をするとコンパイル時にエラーになる
• コンパイルに成功すると、JSと同様のvarの変数宣言になる
• JavaScriptになかった厳格さが取り入れられるので深刻なバグを減らせそう