JavaScriptの需要とともに型、オブジェクト指向を持つTypeScriptの人気も上がってきています。
ここではTypeScriptを理解する上で必要な初歩的な知識を記載しており、TypeScriptの使い方は詳しく説明しませがTypeScriptを利用する上でドツボにはまる前に復習の意味も兼ねて確認しておきましょう。
目次
復習も兼ねて
JavaScript
JavaScriptはブラウザ上で動作するプログラミング言語です。動作環境として必ずブラウザが必要となります。スクリプト言語であるためコンパイラは必要なく、ブラウザ搭載のエンジン(実行環境)上で動作するため実行に必要なコンパイラやビルドツールなどインストールの必要はありません。今現在のWebサービスでJavaScriptなしでサービスを提供している方が珍しいくら普及しています。
node.js
node.jsはかつてServer Side JavaScriptと呼ばれていました。node.jsは昔Linux上でのみ動作可能だったのですが、今現在ではWindows、MacともにサポートしているためServer Side JavaScriptは過去の表現の仕方です。
node.jsはV8 JavaScriptエンジン上で動作するスクリプト言語です。JavaScriptと異なり実行環境が必要になります。またnode.jsで書かれたコードの拡張子は「.js」ですが、ブラウザ上では動作しません。これはJavaScriptが使えるフロントエンドエンジニアが同じ言語でサーバーサイドの開発も低学習コストでコーディングできる目的の一つだからです。
node.jsにはJavaScriptに存在しない独自のAPIが存在します。JavaScriptに非常によく似た言語でPC(サーバー含む)上で動作すると思ったほうが理解が早いです。
nopde.jsはバージョンアップのサイクルが早いため通常nvm(node version manager)経由でインストールします。
TypeScriptとは
TypeScriptは型やオブジェクト指向を持つJavaScript言語のようなものです。TypeScriptのコード拡張子は「.ts」です。「.ts」ファイルを直接実行することはできないため、これをトランスコンパイルし、JavaScriptファイルである「.js」に変換します。
TypeScriptは2種類の目的が存在する
TypeScriptは2種類のトランスコンパイラ方法があります。
- ブラウザで動作させるJavaScriptファイルを生成するため
- node.jsで動作させるJavaScriptファイルを生成するため
ブラウザでのJavaScriptで有名な命令でwindows.alertがあります。これを実行するとブラウザ上でアラート(警告)が表示されます。しかし、node.jsはブラウザを介せず、PC上で動作するためwindows.alertコマンドは理解できません。
TypeScriptを利用する場合は実行環境がブラウザかnode.jsなのか理解しておく必要があります。
どのようにトランスコンパイラするかはtsconfig.jsonに記載しますが、このファイルの作成は難易度が高いです。しかし自力で作製せずにフレームワークを使用し構築するシステムに適したtsconfig.jsonを作製してくれるツールがたくさんあります。それらを利用するほうがミスもなく効率が良いでしょう。
TypeScriptのメリット
JavaScriptは現代のアセンブラと呼ばれるほど難解な言語です。原因は型指定が存在しないことにあると思います。変数に整数型、文字型、オブジェクト型、変数まで何でも入ることができます。変数にパラメータを渡すときにも何を渡せばよいのか、必須変数は何なのかAPI仕様書を読むか、無ければコードを読むしかありません。
しかしTypeScriptにより型を明確にすることにより、それらの無駄な作業時間がなくなります。また型が正確に指定していると、VS Codeなどでコーディングする際に補完機能が働きタイプミスやパラメータミスなど初歩的なバグを無くす事ができ、開発効率も上がります。
メリットを一言でいうならば「開発効率が爆上がり」につきます。
環境構築が必要な分、スロースターターですが、それに有り余るほどの見返りがあります。
補足：トランスコンパイラとは
あるプログラミング言語で書かれたプログラムのソースコードを入力として受け取り、別のプログラミング言語の同等のコードを目的コードとして生成する、ある種のコンパイラである
ビルド・コンパイルと呼び方が異なるのは、実行ファイルを出力するのではなく、あくまで別言語のファイルを出力するのが目的であり、役割を明確にするために呼び方をわけているのだと思います。