大連オフショア開発でも、最近はWebシステム開発の依頼が増えてきています。多くは、PHPやJAVAのサーバサイドの機能の開発を担当することが多いですが、React.jsやVue.JSなどフロントサイドの開発も時々依頼を受けることがあります。フロントサイドの開発も、もっと受けられるように新しい技術の学習も進めて行きましょう！
今回は、AltJS（Alternative JavaScript = JavaScript の代わりとなる 言語）としてのTypeScriptの紹介をします。詳しくは、公式サイトを見て各自学習をしてください。
公式サイト：https://www.typescriptlang.org/
◆TypeScriptとは
マイクロソフトが開発したオープンソース言語で、一言で言うと、「型定義できるJavaScript」です。
◆特徴としては
- JavaScript のスーパーセット（上方互換）となっている。
- JavaScriptの最新仕様である、”ES2018″ の構文仕様が使える。
- 型定義が使える。
- インターフェース、クラスがつかえる。
- null/undefined safe にできる。
- 型定義ファイルがあれば外部ライブラリも型を利用できる。
- ジェネリックが使える
- エディタによる入力補完が強力。(Visual Studio Code など対応しているエディタ)
TypeScriptで書いたコードをコンパイルをかけることで JavaScript に変換し、ブラウザ等で利用することになります。
TypeScriptでは、型の指定を矯正するなどの制約を設けることができ、コンパイルをするときに、制約のチェックを行います。そうすることで、JavaScript では実行時にしかわからないバグを未然に防ぐことができます。
１．JavaScript のスーパーセット（上方互換）となっている
TypeScript は、JavaScriptの仕様を拡張したものになっているので、JavaScriptで書いたものは、TypeScript としても有効です。
例えば、if や for, case といったステートメントや、{a: “hoge”} や [“a”, “b”] といったオブジェクトや配列のリテラルはそのまま使えます。
２．型定義が使える
型定義の基本
JavaScript からの拡張として、変数の型定義があります。型定義には、さまざまな仕様があります。
変数に定義した型と割り当てた値の型が違う場合、コンパイルする際にエラーとなり、事前にバグに気づくことができます。
３．インターフェース、クラスがつかえる
Java や C# などと同じようにインターフェースとクラスの定義ができます。
実は、クラス定義は JavaScript の ES2015 というバージョンで導入されていますが、TypeScriptは更にそれを拡張しています。
４．型定義ファイルがあれば外部ライブラリも型を利用できる
JavaScript でWebアプリ等を作成する場合は、React や jQuery、moment などのライブラリを利用することが多いと思います。
それらのライブラリの言語は当然、JavaScript で提供されているので、そのライブラリにどういったオブジェクトや関数が用意されているので、関数の引数、戻り値は何なのかは、ライブラリの仕様書を見ないとわかりません。
TypeScript では、ライブラリがTypeScript用の型定義ファイルを提供していることがあり、それがあれば TypeScript でライブラリのAPI情報がわかり、コンパイル時にチェックすることができます。
TypeScript 用の型定義ファイルは、npm リポジトリに @types/[ライブラリ名] で提供されています。
５．ジェネリックが使える
ジェネリックとは、クラスや関数で、その中で使う型を抽象化し、外部からその型を指定できるようにすることで、そのふるまいを変えることができるものです。
６．エディタによる入力補完が強力
エディタが TypeScript の入力支援機能をサポートしている場合、型定義から入力候補を表示する事ができます。
これのために、TypeScriptを採用していると言ってもいいくらい便利な機能で、開発効率が格段に違います。
TypeScript と同じマイクロソフトが開発している、 Visual Studio Code がおすすめです。
まとめ
近年、JavaScrpt は Webアプリケーション のみにかかわらず node.js でのサーバーサイド処理や、Electron でのデスクトップアプリ、React Native を使ったモバイルアプリなど、その活用範囲は広がっています。
TypeScript はそういった中～大規模になるプロジェクトで活躍する事ができる言語ですので、是非身につけてください。
引用：https://qiita.com/EBIHARA_kenji/items/4de2a1ee6e2a541246f6?fbclid=IwAR1uo-j7R9swp8IQcvu1DpxGI4cE6owO3vrzTdovr4aKBVXtQYIJvVcmb7E