TypeScriptとは何か

TypeScript とは

TypeScript（タイプスクリプト）は、JavaScriptに型を追加した言語です。

Microsoft が開発しており、2012年に公開されたオープンソースソフトウェアです。
拡張子は .ts で、コンパイル（変換）すると通常の JavaScript（.js）になります。

TypeScriptはJavaScriptのスーパーセットです。
つまり、JavaScriptの文法や実行環境はそのままに、新機能を追加した言語がTypeScriptです。

「型」とは何か

型とは、データの種類のことです。

たとえば、日常生活でも「これは数字」「これは文字」と自然に区別していますよね。
TypeScript では、この区別をコードに明示的に書きます。

// JavaScript - 型を書かない
let age = 25;
let userName = "田中";
 
// TypeScript - 型を書く
let age: number = 25;
let userName: string = "田中";

: number や : string の部分が型注釈（かたちゅうしゃく）です。
「この変数には数値しか入れません」「この変数には文字列しか入れません」と宣言しています。

動的型付けと静的型付け

プログラミング言語は、型のチェック方法によって2種類に分かれます。

動的型付け（JavaScript など）

実行してみるまで型のエラーがわからない方式です。

// JavaScript（動的型付け）
let value = "こんにちは";  // 文字列を代入
value = 100;               // 数値に変えてもエラーにならない
value = true;              // 真偽値にしても OK
 
// 実行するまで問題に気づけない
function double(x) {
  return x * 2;
}
double("hello");  // NaN（Not a Number）になるが、実行するまでわからない

変数にどんな型の値でも入れられるので手軽ですが、予期しないバグが実行時に起きやすくなります。

静的型付け（TypeScript など）

実行する前（コードを書いている時点）に型のエラーを検出する方式です。

// TypeScript（静的型付け）
let value: string = "こんにちは";  // 文字列型と宣言
value = 100;    // エラー: 'number' 型を 'string' 型に割り当てられません
value = true;   // エラー: 'boolean' 型を 'string' 型に割り当てられません
 
function double(x: number): number {
  return x * 2;
}
double("hello");  // エラー: '"hello"' は 'number' 型に割り当てられません

型が合わないコードを書くと、実行する前にエディタやコンパイラがエラーを出してくれます。

比較

TypeScript を使うメリット

1. バグを事前に防げる

先ほど挙げた通り、バグが圧倒的に減ります。小規模な関数などでは宣言するほうがめんどくさい場合もありますが、 規模が大きくなると全体を把握し続けるのは困難になります。また、チームで開発する場合なども決められた型で データをやり取りするようにするとバグの可能性を減らすことができます。

2. 実務の現場では TypeScript が主流

チーム開発に最適で利用者が多く、TypeScriptを前提としたフレームワーク(便利アイテム)が複数公開されています。 現在の開発現場では、JavaScript ではなく TypeScript で書くのが主流です。

小さなスクリプトなら JavaScript でも十分ですが、チームで開発するアプリケーションでは TypeScript が選ばれています。

TypeScript が使われている場所

Node.js ガイドで紹介したフレームワークのほとんどが、TypeScript に対応しています。

このサイト自体も TypeScript で作られています。

セクションまとめ