TypeScriptとJavaScriptのビルド・実行環境の違いを完全解説!tscとnodeの基礎
生徒
「TypeScriptとJavaScriptって、実行するやり方は同じなんですか?」
先生
「TypeScriptはそのままでは実行できないので、実行できる形に変換する必要があります。」
生徒
「どうやって変換するんですか?難しそうです。」
先生
「変換にはtscというツールを使います。順番に説明していくので心配しないで大丈夫ですよ。」
1. TypeScriptとJavaScriptの違いは実行方法にもある
TypeScriptとJavaScriptの違いを理解するためには、最初にプログラムがどのように実行されるかを知ることが大切です。パソコンで動くプログラムは、そのままでは理解できない言葉を、人間が分かりやすい言葉のように、コンピュータが理解できる形へと変換する必要があります。この変換作業をコンパイルと呼びます。
JavaScriptは変換しなくてもブラウザやNode.jsでそのまま動きます。つまり、作ったファイルをそのまま実行できるという特徴があります。そのため、初心者にとって取り組みやすい言語として知られています。
それに対して、TypeScriptは変換しないと実行できません。TypeScriptで作ったプログラムは、まずJavaScriptの形に変換した後で実行する必要があります。この変換作業に使うツールがtscです。
2. TypeScriptは直接実行できない理由とは?
TypeScriptは、型の指定など便利な仕組みが数多く用意されています。例えば、「変数には数字しか入れない」「この関数の戻り値は必ず文字列」など、プログラムの安全性を高める仕組みがあります。しかし、ブラウザやNode.jsはこれらの型情報を理解できないため、JavaScriptに変換してから実行する必要があります。
つまり、TypeScriptで書いたコードは、まずtscでJavaScriptに変換され、そのJavaScriptをNode.jsやブラウザが実行するという流れになります。
3. tscを使ったTypeScriptファイルの変換方法
tscとは、TypeScript Compiler(コンパイラ)の略で、TypeScriptのファイルをJavaScriptに変換するための公式ツールです。次の例は、簡単なTypeScriptのプログラムです。
let message: string = "こんにちは TypeScript";
console.log(message);
このコードは、次のコマンドでJavaScriptに変換します。
tsc sample.ts
このコマンドを実行すると、同じフォルダにsample.jsというJavaScriptファイルが作成されます。
4. Node.jsを使ったJavaScriptの実行
変換されたsample.jsは、Node.jsという実行環境を使って動かすことができます。Node.jsとは、ブラウザを使わずにパソコンでJavaScriptを実行するためのソフトです。次のコマンドで実行できます。
node sample.js
実行結果は次のようになります。
こんにちは TypeScript
5. TypeScriptとJavaScriptの実行の流れを図で理解しよう
TypeScriptとJavaScriptでは、プログラムが動くまでの流れに違いがあります。以下のように整理できます。
TypeScript (.ts)
↓ tsc(コンパイル)
JavaScript (.js)
↓ node または ブラウザで実行
つまり、TypeScriptは変換が必要な言語、JavaScriptはそのまま実行できる言語だと覚えておくと理解しやすいです。
6. なぜTypeScriptは変換が必要なのに人気なのか?
TypeScriptは、JavaScriptよりも多くの追加機能を持ち、大規模な開発でも安心してプログラムが書けるという大きな強みがあります。また、先にtscでチェックすることで、実行する前に間違いを見つけられるため、エラーが発生しにくくなり、トラブルも少なくなります。
そのため、企業の開発でも広く使われている言語であり、学習しておくと将来の仕事にもとても役に立ちます。
7. 初心者が覚えるべきポイント
TypeScriptは変換してから実行する、tscが変換を担当する、nodeが実行を担当する、この三つを覚えておけば大丈夫です。最初は新しい言葉が多く感じますが、慣れてくると自然に理解できるようになります。