次世代JavaScript「AltJS」の注目株!Googleも採用した新世代のスクリプト言語TypeScriptとは?特徴や強み、JavaScriptとの違いを解説

最終更新日:2021年10月29日

レバテックキャリアは
ITエンジニア・Webクリエイター専門の転職エージェントです

TypeScriptは、JavaScriptの後継と言われるプログラミング言語です。近年はJavaScriptの後継言語がいくつか生まれており、その中でも特に有力な言語として注目されています。長年にわたり高いシェアを維持してきたJavaScriptの後継ですから、エンジニアのキャリアパスに与える影響も少なくないはずです。ここでは、TypeScriptの概要と特徴、強み、JavaScriptとの違いなどを解説しています。

1. TypeScriptとは?

まずTypeScriptの概要と特徴について解説します。

JavaScript後継の最有力言語「TypeScript」

TypeScriptは、Microsoft社が2012年に開発したJavaScriptのスーパーセットです。スーパーセットとは「上位互換」のことで、JavaScriptが持つ機能を維持しつつ、追加の機能をそなえた言語と言うことができます。

TypeScriptはなぜ生まれた?

JavaScriptは当初、クライアント側のプログラミング言語として開発されました。しかし、JavaScriptは徐々にサーバーサイド開発にも使用されるようになり、本来想定していた用途から外れていきます。JavaScriptも市場の要求に応じて随時拡張されていくものの、あまりにも複雑になりすぎたことが問題視されていました。特に近年は、純粋なオブジェクト指向言語ではないことから、コードが冗長になりやすいことが課題でした。

こうした問題を解決するために登場したのがTypeScriptです。TypeScriptはサーバーサイドなど大規模かつ複雑な開発に耐えられるよう、オブジェクト指向の概念が積極的に取り入れられています。

TypeScriptは有力なAltJS

また、TypeScriptは「AltJS」のひとつであり、次世代のJavaScriptの最有力候補です。AltJSとは、「Alternative JavaScript」の略称で「JSの代わりになるもの」という意味が込められた造語です。具体的には、JavaScriptより優れた機能を持ち、コンパイル(トランスパイル)後はJavaScriptのコードが生成される言語を指します。

TypeScriptの基本的な構文はJavaScriptと非常に良く似ているため、JavaScriptを習得している人間ならば短期間で身に着けることができるでしょう。また、JavaScriptができることはTypeScriptでも実現可能なため、ほとんど前提知識を持たないプログラマーであっても、リファレンスを見ながら開発を続けていくことができます。

TypeScriptは、Googleが2017年に社内の標準開発言語とするなど話題性があり、近年は知名度があがっています。日本国内ではまだまだマイナーな存在ですが、徐々にJavaScriptからの移行が進んでいくと思われます。

TypeScriptの特徴

では、TypeScriptの特徴を整理してみましょう。

静的型付け(型定義)

TypeScriptの最大の特徴は「静的型付け」が利用できる点です。静的型付けとは、変数やメソッドの戻り値に特定の「型(string、intなど)」を指定できる機能を指します。ちなみに、型指定を行わない場合は「動的型付け」と呼ばれます。TypeScriptは「型の定義ができるJavaScript」と呼ばれており、静的型付けは重要な拡張のひとつでもあります。

静的型付けが可能になると、変数や戻り値に指定外のデータが入るようなコーディングを行った場合、コンパイル時にエラーが出力されます。つまり、実際にプログラムを稼働させる前にバグの存在を知ることができるのです。

インターフェースとクラスの定義が可能

TypeScriptは、C#やJavaなどと同様にインターフェースとクラスの定義が可能です。ちなみにクラス定義はJavaScriptでも導入されていますが(バージョンES2015以降)、TypeScriptではES2015をさらに拡張しているようです。

基本構文はJavaScriptとほぼ同じ

TypeScriptは、JavaScriptの拡張版であり、JavaScriptのコードはTypeScriptとして使用することができます。具体的には、if文やfor文のような基本構文はそのまま流用することができるでしょう。

JavaScriptの知識を流用しながら基本的なコーディングを行えるため、JavaScriptからの移行コスト(学習コスト)は非常に低いです。ちなみにTypeScriptには、JavaScriptの最新仕様が含まれるため、JavaScriptの知識を補強するような使い方もできます。

ただし、TypeScriptのコンパイラに対して何らかの制約(オプション)を付与している場合は、JavaScriptコードに対してコンパイルエラーが発生することもあります。

2. TypeScriptの強み

次にTypeScriptの強みについて解説します。ここで言う強みとは、「開発者にとってのメリット」を指します。

記述量の少なさ

TypeScriptでは、JavaScriptに比べるとすっきりと短いコードを書くことができます。また、生成したクラスごとにfunctionを管理できるため、複数人によるコーディング作業を効率化しやすいというメリットもあります。

可読性が高い

同じ処理をJavaScriptとTypeScriptで記述して比較すると、大半の人は「TypeScriptが読みやすい」と感じるようです。これは、「静的型付け」の効果によるものです。

JavaScriptとの互換性

前述したように、TypeScriptはJavaScriptのスーパーセット(上位互換)です。つまり、JavaScriptの開発・実行環境がそのままTypeScriptの開発・実行環境になるわけです。また、JavaScriptで作成したコードをTypeScript側から呼び出すことや、JavaScript向けのライブラリ・フレームワークをTypeScriptで使用することもできます。

強力な型推論

型推論とは、ある変数の宣言時に値を渡すと、わざわざ型を指定せずとも、自動的に型付けが行われたように振る舞う機能です。TypeScriptはこの型推論がかなり強力で、プログラムの実行前に型に関するエラーの大半を検知することができます。

例えば、数値(number)が入るべき引数に他の文字列(stringなど)が入力された場合「”number”以外の型が引数に指定されている」といったメッセージが出力されます。このエラーメッセージは、コンパイル時に加えコーディングの最中にも確認することが可能です。これは、後述のコード補完・エラーチェック機能との連携によるものです。

ジェネリック(ジェネリクス)

ジェネリックとは、関数やクラスの中で使う型を抽象化し、汎用的に使える状態を創り出す機能です。一般的には、主に汎用的なクラス、関数などを定義する際に使用されます。ごく簡単に言うと「単一のコードで複数のデータ型に対応できるような処理を実装する機能」ですね。

一般的に、静的型付けを行う言語では、関数やクラスの定義時に、引数のデータ型・戻り値の型など指定します。しかし、全く同じ処理にもかかわらず「型」だけが異なる場合には、同一のコードを何度も記述し、呼び出さなくてはなりません。なぜなら、型が異なるだけでエラーが発生するからです。

当然ながらコードの記述量が増え、可読性は低下し、場合によってはパフォーマンスにも影響があります。この非効率な状態を解決する機能がジェネリックです。

ジェネリックを活用すると、関数やクラスを呼び出す際に型の情報を渡すことが出来るため、型を固定せずに処理を記述することができます。また、わざわざ同一の処理を何度も記述する必要がありません。

エディタによるコード補完やチェックメッセージが強力

TypeScriptでは、エディタが提供する各種支援機能を利用できることがあります。

例えばTypeScriptの入力支援機能をサポートしているエディタであれば、型定義から入力候補が表示されます。また、静的型付けと異なるデータが入る可能性のあるコードに対しては、チェックメッセージが表示されます。

コード補完やチェックメッセージが無い場合でも、型推論によってコンパイル時にエラーが出力されるため、実行時エラーは防ぐことができるでしょう。しかし、こうした機能を活用すれば、コンパイルを実行する前にエラーを検知できるため、開発効率が向上します。現役のプログラマーが最もメリットを感じやすい機能のひとつと言えます。

ちなみにTypeScript向けのエディタとしては、開発元のMicrosoft社がリリースしている「Visual Studio Code」やオープンソースの「Atom」などがおすすめです。

動作が速い

TypeScriptは静的型付けを利用することで、動的型付けのJavaScriptよりも処理速度を向上させることができます。また、TypeScriptは定期的なバージョンアップにより処理速度が改善されています。特にバージョン3.9以降は、特定の編集・コンパイルなどに対して処理速度の問題を解決するなど、動作性を意識した改善がありました。

3. TypeScriptとJavaScriptの違い

ここで、TypeScriptとJavaScriptの違いを整理しておきましょう。前述したようにTypeScriptはJavaScriptの上位互換(スーパーセット)です。TypeScriptには、JavaScriptから拡張された点がいくつも存在します。両者の違いは、この拡張に含まれると考えて良いでしょう。例えば、次のような点です。

クラスベースかプロトタイプベースか

TypeScriptはクラスベースのオブジェクト指向言語です。一方、JavaScriptは「プロトタイプベースのオブジェクト指向スクリプト言語」と言えます。

クラスベースオブジェクト指向言語では、新しいオブジェクトを作成するときに「クラスのインスタンス」が作成されます。これに対して、プロトタイプベースのオブジェクト指向言語ではオブジェクトを作成するときに「プロトタイプのクローン」を作ります。プロトタイプを使用してクラスを作成するわけですね。

また、より一般的な言い方をすれば「TypeScriptはオブジェクト指向言語」ですが、「JavaScriptはスクリプト言語」です。

「スクリプト言語」とは、記述したコードをテキストのまま実行可能なプログラミング言語の総称です。また、高水準(人間が理解しやすく、機会からは遠い)で、コンパイルが不要(インタープリタ型)という特徴も持っています。

TypeScriptはJavaScriptと同じ特徴をもつスクリプト言語でもあります。また、オブジェクト指向の考え方を取り入れて拡張された言語です。オブジェクト指向の詳しい説明は割愛しますが、JavaScriptよりも「処理対象のモノ化」が強力になった言語と言えます。

ちなみに、TypeScriptは「トランスパイル(ソースコードからソースコードへのコンパイル)」が可能という点でもJavaScriptと異なっています。

型付けの違い

前述したようにTypeScriptは静的型付けが可能な言語です。これに対してJavaScriptは動的型付けを行います。

動的型付けは、データ型の宣言が不要で、プログラム側が自動的に型を決定します。動的型付けの言語としては、JavaScript・Ruby・Pythonなどが代表的です。

一方TypeScriptが採用する静的型付けは、データ型を明示的に指定します。

動的型付けは、型を宣言する必要がないことでコードの記述量を小さくできることがメリットです。また、型の変動が激しい状況や規模の小さいプログラムへの実装に適しています。ただし、データ型と実際のデータが合致しているかは、プログラムを実行してみるまでわかりません。つまり、「実行時エラー」を防ぎにくいのです。

これに対して静的型付けは、あらかじめデータの型を宣言してから開発を行うため、実行時エラーを著しく削減することができます。コンパイル時にエラーが出力されるほか、後述するエディタの機能でも型のエラーを確認できるからです。また、データ型を指定することでメモリを効率よく使えたり、パフォーマンスを改善できたりといったメリットもあります。

モジュールの有無

TypeScriptにはモジュールがありJavaScriptにはモジュールがありません。モジュールとは、端的に言えば「機能の単位」です。モジュールごとに開発を進めることにより、コードの保守性や再利用性が向上するというメリットがあります。

TypeScriptには「グローバルモジュール」「内部モジュール」「外部モジュール」という概念があります。グローバルモジュールとは、プログラム内のどこからでも変数やメソッドを呼び出せるモジュールです。

これに対して内部モジュールは、共通のメソッドや変数をグローバル空間に置きたくない場合(置いてはいけない場合)に用いる仕組みです。また、外部モジュールは、ある機能を複数のファイルに分割し、それぞれをモジュールとして参照する仕組みを指します。

インターフェースの有無

TypeScriptにはインターフェースがありJavaScriptにはありません。

ここで言うインターフェースとは、一般的な意味(二つの異なる領域の接点)とは異なります。オブジェクト指向プログラミングにおけるインターフェースとは、「実際の処理は持たないが、プログラムに対して特定の約束や振る舞いを付与する機能」です。

インターフェースを使用することで、型やクラスだけでは実現できない処理(多重継承など)を実装することができます。例えば、インターフェースで定義した型があれば、その型を含むデータがクラスに必ず含まれるという具合に、未来のふるまいを指定できるわけです。また、プログラムによって使用するメソッドを分けたり、誤ったメソッドの使用を防止したりといった使い方も可能です。

引数の扱い方

JavaScriptでは、全ての引数が任意であり、状況に応じて自由に省略することが可能です。一方、TypeScriptでは、関数の引数名のあとに「?」を付与することで、引数自体をオプションにすることができます。つまり、「引数が無くてもコンパイルエラーにならない」という印ですね。

また、TypeScriptではデフォルト引数に初期値を指定できたり、引数を可変長にしたりといった機能もあります。これらはJavaScriptから拡張された機能のひとつです。

4. TypeScriptの将来性

最後にTypeScriptの将来性について解説します。結論から述べると、「TypeScriptの将来性は十分に高い」と言えるでしょう。その理由は次のとおりです。

Google上での検索回数は年々増加傾向

Google上での検索回数をもとにプログラミング言語をランク付けするPYPL(PopularitY of Programming Language)によれば、TypeScriptは2020年は10位、2021年は9位に位置しています。(※)ちなみに、JavaScriptの検索回数は3位(2021年)です。しかしこれは、JavaScriptの歴史が長く、使用者も多いことを考えれば当然の結果と言えるでしょう。

参考:PYPL「PYPL PopularitY of Programming Language index」

JavaScriptからの移行が容易で機能は強力

TypeScriptはJavaScriptを素直にグレードアップした言語です。「全く別の言語」とまでは言えないものの、互換性の高さを維持しつつ新たな概念を導入しています。オブジェクト指向が当たり前になった現代では、JavaScriptに比べて高機能なTypeScriptの評価が高まっていくでしょう。特に「移行のしやすさを維持しつつ、扱いやすく速くなった」という点は強力なアピールポイントです。

メジャーなフレームワークに対応

TypeScriptは、「Angular」「Vue.JS」「React」などメジャーなJavaScriptフレームワークに対応しています。プログラミング言語の人気は、フレームワークの豊富さや使いやすさにも左右されます。また、慣れ親しんだフレームワークを使い続けられることで、TypeScriptへの移行コストも小さくなります。JavaScriptの持つ豊富なフレームワークは、そのままTypeScriptの人気を支える資産となるわけです。

ITエンジニア・Webクリエイターの転職ならレバテックキャリア

レバテックキャリアはIT・Web業界のエンジニア・クリエイターを専門とする転職エージェントです。最新の技術情報や業界動向に精通したキャリアアドバイザーが、年収・技術志向・今後のキャリアパス・ワークライフバランスなど、一人ひとりの希望に寄り添いながら転職活動をサポートします。一般公開されていない大手企業や優良企業の非公開求人も多数保有していますので、まずは一度カウンセリングにお越しください。

転職支援サービスに申し込む

また、「初めての転職で、何から始めていいかわからない」「まだ転職するかどうか迷っている」など、転職活動に何らかの不安を抱えている方には、無料の個別相談会も実施しています。キャリアアドバイザーが一対一で、これからのあなたのキャリアを一緒に考えます。お気軽にご相談ください。

「個別相談会」に申し込む

プロのアドバイザーがあなたのお悩みや疑問にお答えします

- 転職個別相談会開催中 -

相談内容を選択してください

※転職活動や求人への応募を強制することはありません

人気の求人特集

内定率が高い

関連する記事

人気の記事

スキルアップ記事トップへ

JavaScriptの求人・転職一覧