TypeScriptをphpstromで使用

AltJS？

javascriptの記法があまりにも独特なので他の記法にしたほうが理解しやすいんじゃない？って問題

環境

1. mac book air
2. npm

準備

typescriptをnpm install

npm install typescript -g

PHPStormで実行

起動して新規に追加

「add watcher」をclick

typescriptでクラスを作成

class Sample {
    test1(){
        console.log("hello world");
    }
}

が

javascript

var Sample = (function () {
    function Sample() {
    }
    Sample.prototype.test1 = function () {
        console.log("hello world");
    };
    return Sample;
})();

となるよう

javascriptのJQueryなどは？

JQuery定義をダウンロード

github

typescript

/// <reference path="jquery.d.ts" />
$(function(){
    $(".aaa").on('click', function(){
        console.log("jquery test");
    })
});

↓

/// <reference path="jquery.d.ts" />
$(function () {
    $(".aaa").on('click', function () {
        console.log("jquery test");
    });
});

※普通のjavascript記法も使えるのかな？

※JQueryを使用する場合は定義ファイルなどを使用する必要がある。

所感

classなどをわかりやすく使いやすくなる感じ。
prototypeなどが？？？の場合はこちらのほうがいいかも、変換処理自体が億劫な場合は自力でなんとかするしかないみたいですけど。
phpstormを使用したら以外と簡単に変換できたのでJqueryなどを使用する部分とclassをそれぞれ使用して対応したい場合にclassをどのように作成するのがいいかを確認するのには役に立つ感じ。

普段、classを使わないでJQueryのコールバックメソッドを使用しているのでこの方法は新しい勉強になりそう。