TypeScript入門その1

  1. AltJSとは
    Webプログラミングのサーバー側言語はPHP、Java、Python、Ruby、・・・とたくさんありますが、フロントエンド側の言語となると、ほぼJavaScript一択。しかしJavaScriptにも下記のような問題点があったりします。
    ・型付けが自由すぎてそれに由来する想定外の問題が起きやすい(例えば1==”1″がtrueになったり)
    ・オブジェクト指向が独特(プロトタイプベース)
    ・スコープを絞りにくいそこで、最近ではこう行った問題を解決するために、より実装しやすいプログラミング言語(AltJSと言います)で実装してJavaScriptに変換するというのが流行りになりつつあります。
    というわけで、これから何回かに渡って代表的な AltJSの1つであるTypeScriptについて紹介していこうと思います。
  2. TypeScriptの特徴
    TypeScriptは2012年にマイクロソフトによって開発された言語で、下記の特徴を持っています。
    ・JavaScriptのスーパーセットである(JavaScriptの機能はTypeScriptでも使える)
    ・静的型付けの言語である(数値型の変数に文字列を代入したりするとエラーになる)
    ・クラスやインターフェースなど一般的なオブジェクト指向の機能を持っている(クラスについてはJavaScriptでもES6から使えるようになりましたが)
  3. TypeScriptの環境構築
    まず前提として、npmが使える環境であるとします。とりあえず、Windowsならコマンドプロンプトで、MacならiTerm2で”npm -v”と打ってみて、バージョンが出てくればOKです。入っていない人はこちらを参考にしてNode.jsとnpmをして下さい。
    次に、TypeScriptをインストールします。
    npm install -g typescript
    インストールし終わったら、とりあえず下記の内容をコピーして、.tsを拡張子につけたファイル名(例えばhello.ts)で保存して下さい。

    class Hello {
      public name: string;
      constructor(name: string) {
        this.name = name;
      }
    }
    
    let user = new Hello("World");
    console.log("Hello " + user.name);

    そしたら、”tsc hello.ts”で保存したファイルをコンパイルすればhello.jsというJavaScriptのファイルができているはずです。
    後は、HTMLに埋め込んでブラウザで開けば、検証ツールで”Hello World”と出力されることが確認できますし、node hello.jsでターミナル上で出力を確認してもいいでしょう。次回はTypeScriptで使えるデータ型などについて説明しようと思います。

 

「TypeScript入門その1」への1件のフィードバック

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です