TypeScript | 基礎文法:環境・前提理解 – Node.jsの役割

TypeScript TypeScript
スポンサーリンク

Node.jsとは何かと、TypeScriptとの関係

Node.jsは「ブラウザの外でJavaScriptを動かすための実行環境」です。中身では、もともとChromeなどのブラウザで使われている高速なV8 JavaScriptエンジンを使っていて、それをWindowsやmacOS、LinuxなどのOS上で動かせるようにしたものだと思ってください。ブラウザの代わりにNode.jsがJavaScriptを実行してくれるので、「サーバーサイドの処理」や「開発用ツールの実行」にJavaScriptを使えるようになります。

TypeScriptとNode.jsの関係を一言で言うと、「TypeScriptを開発で使うための土台がNode.js」だということです。TypeScriptコンパイラ(tsc)も、パッケージ管理ツールのnpmも、どちらもNode.jsの上で動きます。なので、TypeScriptの学習や開発環境を整えるときは、まずNode.jsをインストールする、という流れになります。


TypeScriptはそのままでは動かない、という前提

TypeScriptはブラウザもNode.jsも「直接」は理解できない

TypeScriptは「型付きのJavaScript」ですが、ブラウザもNode.jsも、TypeScriptの文法をそのまま理解できるわけではありません。型注釈やインターフェースなど、TypeScript特有の構文は、実行環境から見ると「知らない記号」です。

そのため、TypeScriptのコード(.tsファイル)は、いったん普通のJavaScript(.jsファイル)に変換してから実行する必要があります。この「TypeScript → JavaScript」の変換を行うのが、TypeScriptコンパイラ(tsc)です。

Node.jsが担う役割の全体像

ここでNode.jsが担う役割は、大きく分けて二つあります。
ひとつは、「tsc やその他の開発ツールを動かすための実行環境」としての役割。
もうひとつは、「コンパイルされたJavaScriptを実行するランタイム」としての役割です。

つまり、TypeScriptの世界では、Node.jsは「開発ツールを動かすエンジン」であり、「出来上がったJavaScriptを動かすエンジン」でもある、という二重の意味を持っています。


Node.jsとTypeScriptコンパイルの流れ

tscコマンドとNode.jsの関係

TypeScriptコンパイラであるtscは、Node.js上で動くプログラムです。npmを使ってTypeScriptをインストールすると、tscコマンドが使えるようになり、.tsファイルを.jsに変換できます。

基本的な流れはとてもシンプルです。

まず、TypeScriptのファイルを用意します。

// hello.ts
const greet = (name: string): string => {
  return `Hello, ${name}`;
};

console.log(greet("TypeScript"));
TypeScript

次に、Node.js環境でtscを実行してコンパイルします。

tsc hello.ts

これで、同じフォルダにhello.jsが生成されます。中身は、ブラウザやNode.jsが理解できる普通のJavaScriptです。

最後に、そのhello.jsをNode.jsで実行します。

node hello.js

この一連の流れ、
「TypeScriptを書く → Node.js上でtscを動かしてJavaScriptに変換 → Node.jsでJavaScriptを実行」
という構造が、TypeScriptとNode.jsの基本的な関係です。


Node.jsがあるからできること:npmとツールの世界

npmという「道具箱の入り口」

Node.jsには、npmというパッケージ管理ツールが標準で付いています。これは、「世界中のエンジニアが作ったライブラリやツールを簡単にインストールして使える仕組み」です。

TypeScript自体も、npmを使ってインストールします。

npm install -g typescript

あるいは、プロジェクトごとにローカルインストールすることもできます。npmがあることで、TypeScriptだけでなく、テストツール、ビルドツール、開発サーバーなど、さまざまな開発用ツールを簡単に導入できます。

初心者目線で言うと、「Node.jsを入れると、JavaScriptとTypeScriptのための巨大な道具箱(npm)が使えるようになる」とイメージすると分かりやすいです。

ts-nodeやtsxのような「TypeScriptを直接動かす」ツール

通常は「.ts.js にコンパイルしてから実行」ですが、開発中は「いちいちコンパイルするのが面倒だな」と感じることもあります。そこで登場するのが、ts-nodetsx のようなツールです。

ts-nodeは、「Node.js上でTypeScriptを直接実行しているように見せてくれるツール」です。内部ではコンパイルを挟んでいますが、開発者はnpx ts-node example.tsのように書くだけで、TypeScriptファイルをそのまま実行できます。

npx ts-node hello.ts

このようなツールも、結局はNode.jsの上で動いています。つまり、Node.jsがあるからこそ、「TypeScriptを便利に扱うためのツール群」が動かせるわけです。


Node.jsは「ブラウザの代わり」でもある

ブラウザの外でJavaScript・TypeScriptを試せる

ブラウザだけを使っていると、「HTMLを書いて、<script>タグでJavaScriptを読み込んで…」という流れになります。でも、学習や開発のときに、毎回HTMLを書くのは少し面倒です。

Node.jsがあると、ブラウザを開かなくても、ターミナル(コマンドプロンプト)から直接JavaScriptやTypeScriptの結果を確認できます。

たとえば、コンソールアプリのように、標準出力に結果を出すだけのコードなら、ブラウザは一切いりません。

// calc.ts
const add = (a: number, b: number): number => a + b;

console.log(add(3, 5));
TypeScript

これをtscでコンパイルして、nodeで実行すれば、すぐに結果が見られます。

tsc calc.ts
node calc.js

この「ブラウザに依存しない実行環境」としてのNode.jsは、TypeScriptの学習にもかなり向いています。


環境・前提としてのNode.js:初心者が押さえておきたいポイント

TypeScriptをやるなら、Node.jsはほぼ必須

TypeScriptを本格的に使うなら、Node.jsはほぼ必須の前提環境です。理由はシンプルで、tscnpmも、その他の便利ツールも、全部Node.jsの上で動くからです。

なので、TypeScriptの入門書やチュートリアルは、たいてい最初に「Node.jsをインストールしましょう」と書いてあります。これは、「TypeScriptのためのエンジンと道具箱を先に用意しよう」という意味だと理解してください。

Node.js自体の文法をいきなり覚える必要はない

ここでひとつ安心してほしいのは、「Node.jsをインストールしたからといって、Node.js特有のAPIやサーバーサイドの書き方をいきなり覚える必要はない」ということです。

TypeScriptの基礎文法を学ぶ段階では、Node.jsはあくまで「TypeScriptをコンパイルして実行するためのエンジン」として使うだけで十分です。node ファイル名.jsで実行できる、npmでパッケージを入れられる、そのくらいの理解から始めて問題ありません。


例題でイメージを固める:Node.jsとTypeScriptの最小構成

いちばん小さなTypeScript+Node.jsプロジェクト

イメージを固めるために、「最小限のTypeScript+Node.jsプロジェクト」を頭の中で組み立ててみましょう。

まず、Node.jsをインストールします。これでnodenpmが使えるようになります。

次に、プロジェクト用のフォルダを作り、その中でTypeScriptをインストールします。

npm init -y
npm install --save-dev typescript
npx tsc --init

これでtsconfig.jsonができ、srcフォルダなどに.tsファイルを書いていける状態になります。

たとえば、src/main.tsに次のように書きます。

const double = (n: number): number => n * 2;

console.log(double(10));
TypeScript

そして、コンパイルして実行します。

npx tsc
node dist/main.js

この一連の流れの中で、Node.jsは
npx tscを動かすエンジン」
node dist/main.jsを実行するエンジン」
という二つの役割を果たしています。


まとめ:Node.jsはTypeScriptの「足場」と「エンジン」

TypeScriptの基礎文法や型の考え方を学ぶとき、その裏側で静かに支えているのがNode.jsです。

ブラウザの外でJavaScriptを動かす実行環境であり、
tscnpmといった開発ツールを動かす土台であり、
コンパイルされたJavaScriptを実行するエンジンでもあります。

初心者のうちは、Node.jsを「TypeScriptを動かすためのエンジン兼道具箱」と捉えておけば十分です。そこから少しずつ、「サーバーサイドも書いてみたい」「APIサーバーを作ってみたい」と思ったときに、Node.jsそのものの世界に踏み込めばいい。

今のあなたにとっては、
「Node.jsがあるから、TypeScriptを書いて、コンパイルして、実行できる」
この一点だけ、しっかりイメージできていればOKです。

タイトルとURLをコピーしました