Playgroundで遊ぶ（開発）

先日、オフショアBPの大連の技術者と話していたとき、TypeScriptの話題となりました。まだ取り入れた開発案件は無いそうですが、歓迎するといいます。今度お客様の許可がでましたら、小さな案件ででも取り入れてみたいと思います。

さて、TypeScript のサイトには Playgroundというツールが用意されていて、ブラウザがあればすぐTypeScriptを試す事ができます。TypeScriptがJavascriptにコンパイルされた結果をすぐ確認できます。

http://www.typescriptlang.org/Playground/TypeScriptで左側に書くと、右側に素のJavascriptに変換されます。実行時にはこの素のJavascriptで実行しますのでどんなプラットフォームでも動くという訳です。

Types

TypeScript

メソッドの引数に型を指定できます。

function Greeter(greeting: string) {
 this.greeting = greeting;
}

Javascript

function Greeter(greeting) {
 this.greeting = greeting;
}

実行時には型チェックされないですね。コーディング時に厳密に型を意識する必要がありますね。

Classes

TypeScript

class Greeter { 
 greeting: string; 
 constructor (message: string) { 
 this.greeting = message;
 } 
 greet() {
 return "Hello, " + this.greeting;
 } 
}

Javascript

var Greeter = (

function () {

function Greeter(message) {

this.greeting = message;

}

Greeter.prototype.greet = function () {

return "Hello, " + this.greeting;

};

return Greeter;

}

)();

楽にクラスが書けるようになりました。

Modules

TypeScript

module Sayings {
 export class Greeter {
 greeting: string;
 constructor (message: string) {
 this.greeting = message;
 }
 greet() {
 return "Hello, " + this.greeting;
 }
 }
}
var greeter = new Sayings.Greeter("world");

var button = document.createElement('button')
button.innerText = "Say Hello"
button.onclick = function() {
 alert(greeter.greet())
}

document.body.appendChild(button)

Javascript

var Sayings;
(function (Sayings) {
 var Greeter = (function () {
 function Greeter(message) {
 this.greeting = message;
 }
 Greeter.prototype.greet = function () {
 return "Hello, " + this.greeting;
 };
 return Greeter;
 })();
 Sayings.Greeter = Greeter; 
})(Sayings || (Sayings = {}));

var greeter = new Sayings.Greeter("world");
var button = document.createElement('button');
button.innerText = "Say Hello";
button.onclick = function () {
 alert(greeter.greet());
};
document.body.appendChild(button);

いままでJavascriptで名前空間を管理するのは私的には無理でしたが、これでできるようになりますね。

---

御社のビジネスに精通した専属プロジェクトチームを安価に運営！ラボ契約チームをオフショアで持つならオフショア開発.jp.netまでご相談ください。コミュニケーションに長けたチームをご提供いたします。