TypeScriptとは？JavaScriptと書き方の違いはほとんどない？

こんにちは！
現役Webエンジニアの今井(@ima_maru)です。

本記事は、今注目を集めているプログラミング言語「TypeScript」についての記事になります。

Microsoftが開発した比較的新しい言語で、人気急上昇中のプログラミング言語です。

Googleの社内標準言語に採用されたこともあり、近年着実に案件数を伸ばしてきています。

そんな今注目のプログラミング言語「TypeScript」について詳しく見ていきましょう。

プログラミング言語「TypeScript」とは？「JavaScript」との違いは？

プログラミング言語「TypeScript」は、2012年に登場した比較的新しいプログラミング言語で、Microsoftが開発していることでも有名です。

TypeScriptの最大の特徴はコンパイルするとJavaScriptのコードを生成するということであり、JavaScriptの上位互換のような存在となっています。

GoやRustといった言語と同じく、近年人気が急上昇している言語の1つです。

TypeScriptはJavaScriptコードを生成するプログラミング言語

TypeScriptはの最大の特徴は、コンパイルをするとJavaScriptのコードを生成するということです。

つまり、TypeScriptは「JavaScriptのコードを生成するためのプログラミング言語」といってもよいでしょう。

このような、ソースコードから別の言語のソースコードへのコンパイルのことをトランスパイルと言ったりもします。

別のプログラミング言語に変換されるって面白い。（アセンブリ言語への変換とかならよくある話だけど。）

TypeScriptとJavaScriptの書き方の違いは？ほとんどない。

TypeScriptで書かれたコードとJavaScriptで書かれたコードは非常によく似ています。

let message: string = "Hello, World!";
console.log(message);

let message = "Hello, World!";
console.log(message);

変数定義の時の「: string」だけが違いますね。この違いは次の静的型付けの説明で話します。

実際、TypeScriptとJavaScriptの書き方の違いはほとんどありません。

上記の例もわざとTypeScriptらしく書いたコードなだけで、JavaScriptのコードをコピペしても動きます。

これは、TypeScriptがJavaScriptの完全上位互換（スーパーセット）であるからです。

つまり、JavaScriptでできることはTypeScriptでできるという関係性があり、JavaScriptで書かれたコードはすべてTypeScriptでも有効だということです。（逆は成り立ちませんが。）

この特徴は、以下のようなメリットを生みます。

JavaScriptの書き方の違い①：TypeScriptは静的型付け

JavaScriptにはないTypeScriptの特徴として「静的型付け言語」であるということが挙げられます。これは、「型定義（データ型の定義）を行うことができる」といってよいでしょう。

例えば、「整数型の変数」「文字列型の変数」といった「○○型」ということをコード上で定義できるのです。

先ほどの例では、TypeScriptのコードには「: string」というコードが書かれていますが、これがまさに型定義です。

let message: string = "Hello, World!";
console.log(message);

stringは、文字列型を表しているため、仮に以下の数値を入れるコードを書くとエラーになります。

let message: string = 1;
// エラー

一方、JavaScriptは「動的型付け言語」と呼ばれ、このような型定義を行うことはできません。（内部で勝手にデータ型が決まる）

let message = "Hello, World!";
console.log(message);

データ型が定義できると、「異なるデータ型を扱っていないか？」「そのデータ型に対して正しい処理を行えているか？」などを事前にチェックすることができるため、プログラムの安全性が増します。

データ型についてのメリットとデメリットを詳しく知りたい方は、以下の記事をご覧ください。

あわせて読みたい

動的型付け言語と静的型付け言語の違いとは？ プログラミング言語の特徴をあらわすときによく使われる「動的型付け」「静的型付け」ですが、 そもそも動的と静的ってどういう意味？動的型付け言語と静的型付け言語っ...

JavaScriptの書き方の違い②：TypeScriptにはオブジェクト指向に関する機能が加えられている

TypeScriptにはJavaScriptの機能に加え、オブジェクト指向プログラミングをサポートする機能が多く加えられています。（詳しくは以下の記事を参照ください）

あわせて読みたい

JavaScriptとTypeScriptのオブジェクト指向機能の比較 | TypeScript入門『サバイバルTypeScript』 簡易な一覧ですが、型に関する機能が拡張されていることがわかると思います。

オブジェクト指向について詳しく知りたい方は以下の記事を参考にしてみてください。

あわせて読みたい

オブジェクト指向とは？メリットは？例を使ってわかりやすく解説！ プログラミングの勉強をしていて、「このプログラミング言語はオブジェクト指向です」などといった言葉を見かけませんか？ こんにちは！今井(@ima_maru)です。 私がこの...

プログラミング言語「TypeScript」でできることとできないこと/苦手なことを紹介！

TypeScriptでできることは多岐にわたります。

主にWebアプリ開発やスマホアプリ開発で用いられることが多いイメージです。

逆に、TypeScriptでできない・苦手なことは以下のようなことです。

TypeScriptでできることは、JavaScriptでできることと同じといってもよいです。

それは先ほども説明したように、JavaScriptのコードを生成するプログラミング言語であるからです。

JavaScriptでできることについて詳しく書いた記事があるので、もっと詳しく知りたいという方は以下の記事をご覧ください。

あわせて読みたい

JavaScriptで何ができる？できること9個とできないこと3個をそれぞれ紹介！ こんにちは！今井(@ima_maru)です。 これからプログラミングを学ぼうと色々調べている方は、「JavaScript」という言語をご存知かもしれません。 このJavaScriptは、Web...

プログラミング言語「TypeScript」は需要と人気が急上昇中！学ぶなら今。

近年、TypeScriptの人気や需要が急上昇しています。

これからメジャーな言語となることも考えられる将来性の高いプログラミング言語です。

そんなTypeScriptの人気や需要を見ていきましょう。

【人気】Googleの社内標準言語のひとつとして採用された。

2017年のGoogleのイベントで「Googleの社内標準言語としてTypeScriptを採用する」ということが発表されました。

あわせて読みたい

Google社内の標準言語としてTypeScriptが承認される。ng-conf 2017 Googleが中心となって開発しているオープンソースのJavaScriptライブラリ「Angular」のイベント「ng-conf 2017」が、4月5日から3日間、米国ユタ州ソルトレイクシティで開催...

この発表のおかげもあり、最近のTypeScriptの人気の上昇はすさまじいことになっています。

【人気】検索ワードランキングで上位にランクイン&急上昇中！

TypeScriptは、人気度ランキングが急上昇中の言語です。

今後、さらに人気になっていくことが予想されます。

【需要】案件数もここ数年で非常に増えてきている！

メジャーなWeb系プログラミング言語などと比べると少ないほうですが、少なくはないと言えるところまで案件数が増えました。今後も増えていくことが予想されます。

プログラミング言語「TypeScript」のまとめ

本記事ではTypeScriptについて解説しました。

TypeScriptの特徴やできることがおわかり頂けたかと思います。

今後TypeScriptの需要はさらに高まっていくと推測されます。

最後までご覧いただきありがとうございます。