ごった煮

色々な事を書いてます

TypeScriptを簡単に覚えてみようその1

TypeScript入門第一回目です.

今回は, .NET風にクラスを作成してHelloWorldしてみます.

まずは, 生成されたJavaScriptのコードを示します. [javascript] var sample1 = (function () { function sample1() { } sample1.prototype.hello = function () { return '<h1>' + 'helloworld' + '</h1>'; }; return sample1; })(); [/javascript]

JavaScriptオブジェクト指向をやろうとすると概ねこれに近いコードを書く必要があるかと思います.

では, 次にTypeScriptでのコードを示します.

[javascript] class sample1{ constructor() { } public hello(): string { return '<h1>' + 'helloworld' + '</h1>'; } } [/javascript]

なんだか最初に見せたコードと比べて随分とすっきりした印象を受けるかと思います.

また, JavaScriptでは, すべての関数の戻り値すら定義せずに書けますが, TypeScriptでは

[javascript] hello() : string{} [/javascript]

のように肩を定義して厳密性の高いコードになるようにしています.

この型の宣言は, 変数に対しても同様に行えます.

あとは, C#のように

[javascript] var sample1 = new sample1(); sample1.hello(); [/javascript]

のようにメソッドが呼び出せます.

まるでC#を書いているように可読性が高く厳密性の高そうなコードがJavaScriptで書けるようになりました.

また, 前回説明した通りCoffieScriptなどのほかのJavaScriptスーパーセットと異なりTypeScriptでは, TypeScriptのまま デバッグが可能なので, 複雑怪奇なJavaScriptを極力触る必要もなく, 大規模な開発やチームでの開発において 非常に威力を発揮するかと思います.