勉強ノート：Typescriptについて①概略と変数(Windows10)

Javascriptに「型の指定」がついたもの。静的型付き言語。
よって、オブジェクト指向にも対応できる。
TypescriptはJavascriptにコンパイルして動作する。
Javascriptと相互にやりとりができ、呼び出しもできる。
Typescriptは大規模アプリ作成にメリットがあるが、場合によっては、
Javascriptの方が処理が高速になる場合もある。

Javascriptでの変数宣言の確認

var a = ”test”;
var b = 5;
var arr = [ ”apple”, "banana", "cake" ];
const d = "プログラム";

上記のように、var (let) は変数の宣言をするだけで、
入れる中身に型の制約は無い。
const も定数で値が変化しないと言うだけで、中身に制約はない。

では、Typescriptの場合

var a: String = ”test”;
var b: Number = 5;
var c: String[] = [ ”apple”, "banana", "cake" ];
const d: String = "プログラム";

なんだ、考え方はJAVAと一緒じゃん。記法は違うけど。。。

VScodeで新しくフォルダを作る。

typescript_lessonに降りる

typescript下で「npm init -y」と書く

↑Node Package Managerを使う

すると、フォルダ内にpackage.jsonファイルが作られる。

Typescriptのインストール

ターミナルで以下のようにTypescriptをインストールする。

「i」は「install」の省略形

すると必要なファイルがインストールされる。

package.jsonファイルの中にtypescriptの指定が入る。

package.jsonの最後の部分。後ろの数字はバージョン。

試しに「 lesson.ts 」と言うtsファイルを作ってみる。

TSファイルの階層に注意

例えば、lesson.tsの中で以下のように書いてみる。コンソールにｂの値を出力する。

書き込んだTSファイルをコンパイル。

↑npmではないことに注意

※npm と npx の違い
npm はパッケージ管理ツール：パッケージとしてインストールされたものを扱うが、 npx は特定のパッケージをインストールせずにしようとするもの。

npx すると、自動的にJavascriptに書き換えたファイル lesson.js が生成される。

lesson.js の中身を見る。

普通にJSファイルに変換されている。

試しにこのJSファイルを実行する。

すると、ｂの値が出力される（省略）。

補足：配列の宣言

と言う風に、2種類の書き方で記述できる。
コンパイルすると。

javascript.ts

②に続く。