Typescriptとは
TypescriptとはMicrosoft社が開発(2012年公開)したJavascriptの進化版言語である。
JavaScriptの欠点を補うために作られた言語で、Webアプリケーション開発、大規模開発での注目が高まっている。
Typescriptで書かれたコードはJavascriptにコンパイル(変換)され、コンパイルされたJavascriptが動作する仕組みである。
なぜTypescriptを使うのか
-
JavaScriptと同じ環境で動かすことが可能
Typescriptはコンパイルし、JavaScriptに変換できるので、JavaScriptが動かせる環境なら、TypeScriptは動かせる。
そのため、開発環境のハードルは低くい。 -
型を宣言するためエラーを未然に防げる
Typescriptは静的型システムである。
型が指定できると、変数に違った型のデータが入り、プログラムが動作しないことがある。この変数にはこの型のデータが入ると、その変数に入るデータを予測しやすくなる。
また、Editorによっては型が違うとエラー表示されるため、開発効率が上がる。 -
TypescriptはES5にコンパイルされる。
Javascriptは毎年アップデートされているため、ES6ではブラウザで認識されず表示されないことがあります。ES5（2009年）では基本的にどのブラウザでも認識される。なので、Typescriptで書いたコードは基本どのブラウザでも表示される。
＊補足＊
静的型システム
Typescriptがコンパイルされる時に、型がチェックされる。変数の値がNumberなのか、Stringなのかそれ以外なのかすべてチェックされる。これが静的型システムがである。
型が違う場合(本来StringではないといけないところがNumberになっている)エラーが出力される。
開発環境を整えましょう
手順
- ターミナルを開く ＊私はWindowsに内蔵されているCMDを使用した
Nodeがインストールされているか確認＊node -vを実行すると確認できる
→インストールされていない場合 Nodeダウンロードターミナル上で npm install -g typescript を実行し、Typescriptのインストールする
Editarを開く＊Typescriptのサポートが内蔵されているVscodeがオススメ
ファイルを作製（拡張子はts）
Typescriptを記述する。このように: string型を指定する
let greeting: string = 'こんにちは';
console.log(greeting);Typescriptをコンパイルする
Editor内のターミナルを開く、Vscodeならメニューバーのターミナルの新しいターミナルを選択するターミナル上で tsc ファイル名 を実行
実行前
実行前のindex.ts
実行後
実行後はindex.jsが生成されました。
問題発生
tsc : このシステムではスクリプトの実行が無効になっているため、ファイル C:\Users\user\AppData\Roaming\npm\tsc.ps1 を読み込むことができません。
詳細については、「about_Execution_Policies」(https://go.microsoft.com/fwlink/?LinkID=135170) を参照してください
原因
実行ポリシーが初期値(Restricted)なので、制限を解除する必要がある。
解決方法
手順
- スタートからWindows PowerShellを開く
- PowerShell上でPowerShell Get-ExecutionPolicyを実行すると、現在の設定を確認できる 恐らく、Restrictedとなっているはず...確認出来たら
- Set-ExecutionPolicy RemoteSignedを実行すると、実行ポリシーの変更が表示される
- 実行ポリシーの変更 実行ポリシーは、信頼されていないスクリプトからの保護に役立ちます。実行ポリシーを変更すると、about_Execution_Policies のヘルプ トピック (https://go.microsoft.com/fwlink/?LinkID=135170) で説明されているセキュリティ上の危険にさらされる可能性があります。実行ポリシーを変更しますか? [Y] はい(Y) [A] すべて続行(A) [N] いいえ(N) [L] すべて無視(L) [S] 中断(S) [?] ヘルプ (既定値は "N"): Y ###Yを入力する
- 再度、PowerShell Get-ExecutionPolicy で設定を確認するとRemoteSignedに変更されています
