活字体

TypeScript是一种由微软开发的自由和开源的编程语言。它是JavaScript的一个超集，而且本质上向这
个语言添加了可选的静态类型和基于类的面向对象编程。而我们这门课程主要介绍了TypeScript的基
本数据类型、函数、接口、类等内容。本课程适合有一定JavaScript基础的同学学习。

活字体のプロフィール

typescriptですとは何ですか？
typescriptですが、Microsoftのフリーでオープンソースのプログラミング言語で開発しています。それには、JavaScriptのスーパーセットで、JavaScriptの互換性、JSコードをロードして実行することが可能です。JavaScriptをプログレッシブ場所と比較すると、次のとおりコメントを追加すると、コンパイラはオーバーヘッド増加することなくコメントを削除しますが、サポートされているコンパイラはオブジェクトや機能を理解しましょう。そして、JavaScriptが大規模なWebアプリケーションのコンセプト開発のために設計されていないだけで、スクリプト言語であり、JavaScriptはクラスとモジュールを提供していない、と活字体は、これらの特性を達成展開します。
　　これは、それが型注釈によって静的コンパイル時の型チェックを提供するとともに、ワークへのコードへの修正なしのJavaScriptのシンタックス、したがって、既存のJavaScriptコードを拡張します。活字体は、既存のJavaScriptコードを扱うことができる、と活字体コードの一方のみがコンパイルされます。
　　活字最大の特徴は、したがって、それが活字体と呼ばれ、入力されます。JavaScriptの弱いタイプと比較すると、入力された活字体を維持するために簡単に思えます。
　　コンパイルされなければならないアプリケーションに活字体を使用するには、コンパイル結果はJS生成されたファイルには、あなたは活字体、コンパイラができtsc、このプロセスのコマンドを完了します。：test.ts（typescriptファイル名の拡張子.TS）をコンパイルするには、次のように命じている
tsc test.ts
コンパイルディレクトリが現在でtest.jsというファイルが生成されます後。
注：DOは活字体が新しい言語とはみなされない、それはまだのJavaScriptにコンパイルされ、最終的な活字体の品質を向上させるためには、単にツールJavaScriptコードです。
最初の活字体プログラム
活字体であるかについての私たちの前で、古典的なプログラムのHello Worldで、我々初見。コードは以下の通りであります：

<script type="text/typescript">
  var hw:string="Hello World!";     //定义一个字符串变量
  document.write(<h1>"+hw+"</h1>);  //将结果显示在页面上，这句话是不是很熟悉呢。
</script>

生徒たちは、ラン内の活字体のJavaScriptコードを使用することができ、それだと、間違っている、非常に慣れていない感じていない、ここを参照してください。学生はまた、上記のコードをタイプtypescriptですである通知そのスクリプトタグに書き込まれる参照します。あなたは、ページ上で直接コンパイルした結果を確認したいのですが、またtypescript.min.jsとtypescript.compile.min.jsを参照する必要がある場合。次のコード：

<html>
<head>
  <title>demo</title>
</head>
<body>
  <script type="text/typescript">
     // TypeScript代码
  </script>
  <script src="lib/typescript.min.js"></script>
  <script src="lib/typescript.compile.min.js"></script>
</body>
</html>

学生は、適切な環境を使用して、直接typescriptですコードラベルに書き込むことができる練習<script type="text/typescript"></script>の間。[ファイル名を指定して実行]は、コードを実行するために、送信ボタンをクリックしてください。
3. TSとJSコード比較
レットの書き込み活字体の例は、次のコードを呼び出して、（次ページで説明）生徒のクラスを定義しています。

class Student{
   name:string;
   age:number;
}
var s1=new Student();
s1.name="Jim";
s1.age=20;
document.write("name:"+s1.name+" age:"+s1.age);

活字体JavaScriptコードがコンパイルされると我々は将来を見て：

var Student = (function () {
    function Student() {
    }
    return Student;
})();
var s1 = new Student();
s1.name = "Jim";
s1.age = 20;
document.write("name:" + s1.name + " age:" + s1.age);

コードを比較することにより、より簡潔でよりよく理解し、保守が容易活字コードを感じていません。それは感じやC ++に似たC＃、Javaの、されていません。
##活字体の基本データ型
###ブールboolen
TypeScriptが基本データ型boolean、number 、string 、 array 、 enum 、any 、void。最初の私たちが言いたいすべてがありますboolean。
　　最も基本的なデータ型は、JavaScriptと活字体（および他の言語が）と呼ばれるシンプルな真/偽の値であり、「ブール値。」カスタムではJavaScriptの変数はvarキーワードによって達成される、と活字体の変数で定義されたフォーマットである：
通过var关键字变量名后面+冒号 + 数据类型来指定
ブール変数定義されている：
var isDone: boolean = false;
###数値の数
　　TSで使用し、JSすべての値浮動小数点していますTSで、我々は「数」タイプとして、それらを定義しながら、入力します。たとえば、次のコードのタイプの可変数を宣言する。

var isNumber:number=6;
var isfloat:number=6.01;

文字列

文字列は二重引用符（「）または、例えば、文字列を示すために、単一引用符（「）のペアのペアを使用して、JavaScriptでのように、文字列を表します。

var name: string = "bob";
var family_name: string = 'Green';

配列array

TypeScript 中数组使用“[]”来声明，代码如下:

var list: number[] = [1, 2, 3];
var name: string[] = ["阿龙","阿猫","阿狗"];

これは、インデックスによって配列要素へのアクセスを持っていました。

var list: number[] = [1, 2, 3];
alert(list[0]));

我々はまた、配列、キーワード配列のいずれかのタイプを定義することができます。

var arr:Array = [1,2,3,"a","b","c"]; // 任意类型数组
alert(arr[1]);

###列挙型列挙
JavaScriptがこのタイプではないながら、列挙型を新たに、活字体追加されます。列挙型の宣言にキーワードを使用します。次のようにコード例は以下のとおりです。

enum Color {
  Red,　　　//枚举元素列表
  Green,
  Blue
};
var c: Color = Color.Green;

同様にC＃、あなたがその値以上の赤が0である、第一項の値を宣言しない場合は、その後、青2緑が1であることを一人一人が増加しています。コードは以下の通りであります：

enum Color {
  Red = 1,
  Green,
  Blue
};
var c: Color = Color.Green;

この場合、値は1でそう赤、緑、青の3 2です。
　　もちろん、あなたも、各項目の値を指定することができます。コードは以下の通りであります：

enum Color {
  Red = 1,
  Green = 2,
  Blue = 4
};
var c: Color = Color.Green;

私たちが値を持っていますが、次のように我々は、列挙型の定義は、以下のようにして得ることができるかどうかわからない場合はさらに列挙機能の特殊なタイプがあります：

enum Color {
  Red = 1,
  Green,
  Blue
};
var colorName: string = Color[2]; //访问第二个枚举子元素Green
alert(colorName);
colorName = Color[4];
alert(colorName);

その後、出力は次のようになりますGreenとundefined。ので、Green値が2である、値が列挙の定義が返される、4であるれていませんundefined。

任意の任意のタイプ

そして、JavaScriptの変数のデフォルトのタイプは、ダイナミックで、いずれかの種類を与えることのできるを参照するのが好き。例えば：

var notSure: any = 4;
notSure = "maybe a string instead";
notSure = false;  // 定义为boolen型

どのように定義した後、それは同じ書き込みJavaScriptに構文を意識相当する機能を失うことになります。
　　次のように任意の配列を使用することができると共に、ことを言及する価値があります。

var list: any[] = [1, true, "free"];
list[1] = 100; //更改list[1]的值

void型関数を空にする

このタイプの機能のみを使用することができ、関数がvoidようなタイプを返すことがあり、それは関数が値を返さないことを示しています。コードは以下の通りであります：

function warnUser(): void {
  alert("This is my warning message");
}

機能

定義と呼び出し機能

文法では活字体定義された関数は次のようになります。

function function_name(arg:number,arg1:number,....):return_type{
  code 函数要执行的代码;
  return data;
}

機能のための重要な関数宣言、functionnameとカスタム関数名、引数、パラメータリスト、_return_typeの戻り値の型として機能する、コードは、関数が呼び出されたときに実行されるコード、データ、データを返すためにreturnキーワードを使用することですリターンへのデータのために、「{}」を使用する同封。関数を呼び出し、次のコードは非常に簡単です：

function add(x: number, y: number): number {  //定义返回值为number类型的函数
    return x+y;
}
add(5,6); //调用函数

もちろん、あなたが値を返すことはできません。

無名関数

匿名関数は、戻り値の型を指定する必要はありません、だけでなく、関数本体の名前で、その戻り値の型は、関数本体内のreturn文から推測されます。次のコード：

var myAdd = function(x:number, y:number) { //定义匿名函数
  return x+y;
  };
myAdd(3,4); //调用匿名函数

オプションとデフォルトパラメータ

オプションのパラメータ：コロンの前に疑問符を添加した後のパラメータ名は、パラメータがオプションであることを示しています。次のコード：

function buildName(firstName: string, lastName?: string) { //lastName为可选参数
  if (lastName)
      return firstName + " " + lastName;
  else
      return firstName;
}
var result1 = buildName("Bob");  //正确调用 Bob
var result2 = buildName("Bob", "Adams"); //正确调用 Bob Adams

デフォルトパラメーター：値が渡されていない場合は、パラメータ名の直後に指定された値は、それがデフォルト値に割り当てられます。次のコード：

function buildName(firstName: string, lastName = "Smith") {
  return firstName + " " + lastName;
}
var result1 = buildName("Bob");  //没有传入第二个参数，则被赋值为默认的smith,结果为:Bob Smith
var result2 = buildName("Bob", "Adams");  //结果为:Bob Adams

注：オプションのパラメータとデフォルトパラメータは、パラメータリストの最後でなければなりません。

活字体类

構造とクラス宣言

JavaScript语言基于函数和原型链继承机制的方式构建可重用的组件。这对于面向对象编程来说显得比较笨拙。在下一代的JavaScript标准将为我们提供基于class base的面向对象的设计方式。但在TypeScript中可以使用这种方式，它将编译为目前大多数浏览器能允许的普通JavaScript代码，所以我们不用在等下一代Javascript标准的到来了。

クラスは、オブジェクト指向プログラミングの中核基盤であるプロパティとメソッドの集合である使用がインスタンス化されなければならない前に、クラスは、実際のプログラムを書くために時間を取ることができません。
　　あなたは活字体クラスを作成すると、それがキーワードクラスを使用して宣言する必要があり、次のように、クラス宣言の基本フォーマットをクラス本体をカプセル化するために、中括弧が続く、キーワードの後にクラス名が続きます。

class 类名{
    //类体
}

基本的な構造は、クラス本体を書き込むことができクラスの完了後に作成されます。クラス宣言は、本体を含み、任意の属性を定義しなくても、インビボクラスにおいて、唯一体のみメソッドのクラス定義の属性を定義することも、もちろん可能プロパティおよびメソッドを定義します。完全なクラス定義フォーマット。

class 类名{
  name:string;  //定义类的属性
  fun(){ //定义类的方法
           //定义该方法所要实现的功能
  }
}

このクラスの活路を定義すると、C＃、JavaやC ++のプログラムにそれを書い感じていません！！！
###定義された属性およびメソッド
上記した説明では、クラスのプロパティとメソッドの理解を有していてもよく、生体内のプロパティとメソッドで特定のクラス定義および使用は、以下に記載しました。
　　（1）プロパティ：クラスの生体内のクラス定義内の変数のような物質の性質、またはパラメータの設定を保存します。
　　（2）方法：通常の機能は、メソッドを定義したと同じように定義されている機能を実装するために使用されるクラス定義の本体中の物質の関数としてクラスのメソッド、アクセスキーは、アクセス方法を制限するために適用されてもよいです。

class 类名{
  name:string;  //定义类的属性
  fun(){ //定义了一个无返回值的方法
           //定义该方法所要实现的功能
  }
  say():string{ //定义返回值类型为string的方法
           //定义该方法所要实现的功能
         return "返回值"; // 用return关键字返回函数值
  }
}

静的プロパティ

活字体のメンバーは、「静的」キーワードタグのクラスを使用することができます。次のコード：

class calc{
  static count=10;
  add(data1:number):number{
    var sum=calc.count+data1;
    return sum;
  }
}
var test=new calc();
document.write(test.add(20));

私たちは、呼び出しを直接上記のメソッドを呼び出すことができることをクラスメンバーの静的プロパティは、例数によって呼び出されますcalc.count。むしろクラスのthis.count内部使用を使用するよりも。

コンストラクタ

コンストラクタは特殊な方法です。主にあなたがオブジェクト、メンバ変数の初期値を割り当てられているオブジェクトを作成するときに、常に新しい演算子でオブジェクトを作成するためのステートメントを使用し、オブジェクトを初期化するために使用。達成するためのキーワードをコンストラクタと活字体のコンストラクタ。CAN（/オブジェクト・インスタンスとアクセスジャワの代表的なメンバーとしてのC＃）現在のクラス本体のプロパティとメソッドにアクセスするには、このキーワードで。

class student{  //定义student类
  name:string;  //定义类的属性
  constructor(myname:string){ //定义构造函数
      this.name=myname;
  }
  study(){ //定义类的方法
           //定义该方法所要实现的功能
  }
}

クラスのインスタンス化

一般情况下，创建一个类后并不能直接的对属性和方法进行引用，必须对类进行实例化，即创建一个对象。TypeScript中用new 关键字创建对象。实例化后通过“.”来访问属性和方法。实例代码如下：

class student{  //定义student类
  name:string;  //定义类的属性
  constructor(myname:string){ //定义带参数的构造函数
      this.name=myname;
  }
   study(){ //定义类的方法
      document.write("<h1> My name is "+this.name+".</h1>");
  }
   write():string{
           return "write name:"+this.name;
  }
}
var s1=new student("Jim");
document.write("<h1>"+s1.name+"</h1>"); //获取name属性
s1.study();   // 调用study方法  
document.write("<h1>"+s1.write()+"</h1>");

継承

拡張キーワードで活字体は、継承を示します。たとえば、あなたは、私たちが基底クラスAを呼び出した場合、Bはサブクラスと呼ばれるように。A継承したクラスA、クラスBを定義しています B.は、次のようにクラスを定義することができます

class B extends A {
  // 类B中的成员
}

私たちは、サブクラスで基底クラスのメソッドを呼び出すために属性にある場合はsuperキーワードを使用する必要があります。次のコード：

class Animal {  //定义基类
  name:string;
  constructor(theName: string) { this.name = theName; }
   move(meters: number) {
      document.write(this.name + " moved " + meters + "m.");
  }
}
class Snake extends Animal { //继承基类
  constructor(name: string) { 
      super(name); //调用基本类的构造函数
  }
   move() { //重写了基类的方法
    document.write("Slithering...<br>");
    super.move(5); //调用基类的方法
  }
}
var sam = new Snake("Python"); //声明Snake类
sam.move();

ではTypeScript、私たちは「を使用するextendsクラス階層を示すために」キーを。ここでは、「見ることができるSnake、」継承Animal「」サブクラスの実装を。また、例えば番組をどのように「親クラスメソッド、オーバーライドすることでSnake、」「を作成move親クラス、オーバーライドする」方法「Animal」と「move」アプローチと「super親クラスのメソッドを呼び出す」キー。

活字体インタフェース

インタフェースの宣言

在TypeScript中，接口是用作约束作用的，在编译成JavaScript的时候，所有的接口都会被擦除掉，因为 JavaScript中并没有接口这一概念。TypeScript中接口是用关键字interface进行声明，例如：

interface LabelledValue { //定义接口
  label: string;          //定义属性
}
interface LabelledValue {  //定义接口
  label: string;
}
function printLabel(labelledObj: LabelledValue) { //定义函数printLabel,其参数类型为接口类型
  document.write(labelledObj.label);
}
var myObj = {size: 10, label: "Size 10 Object"}; //定义含有接口中属性的对象
printLabel(myObj); //调用函数

在上面的例子中，printLabel函数要求传入一个包含一个label的字符串属性。而接口LabelledValue描述了printLabel的所要求的类型对象。它依然代表包含一个label的字符串属性。

オプションの属性

有时不是所有定义在interface中的属性都是必须的，`typescript`中便为我们提供了可选属性。带有可选属性的`interface`定义和c#语言很相似，以`?`紧跟变量名后边表示。如下代码：

interface SquareConfig { //定义了两个可选属性
  color?: string;  
  width?: number;
}
function createSquare(config: SquareConfig): {color: string; area: number} {//定义函数
  var newSquare = {color: "white", area: 100};
  if (config.color) {
    newSquare.color = config.color;
  }
  if (config.width) {
    newSquare.area = config.width * config.width;
  }
  return newSquare;
}
var mySquare = createSquare({color: "black"}); //调用函数，
document.write(mySquare.color);   //结果为： black

あなたはそれが任意の属性であることから、頼むオプション、そう定義するよりも、なぜそれを完全に定義していない、任意の属性を定義することができますプロパティが存在する場合は、制約の種類に、:?あり、これは非常に重要です。

メソッドの種類

在 JavaScript 中，方法 function 是一种基本类型。在面向对象思想中，接口的实现是靠类来完成的，而 function 作为一种类型，是不是能够实现接口呢?答案是肯定的。在 TypeScript 中，我们可以使用接口来约束方法的签名。

interface SearchFunc {  
  (source: string, subString: string): boolean; //定义一个匿名方法
}
var mySearch: SearchFunc;
mySearch = function(source: string, subString: string) {  //实现接口
  var result = source.search(subString);  //调用系统方法search查找字符串的位置
  if (result == -1) {
    return false;
  }
  else {
    return true;
  }
}

上記のコードでは、この方法は、2つの文字列引数がブール値を返し、インタフェース、署名方式のインターフェイス制約を定義します。コードの2番目の段落では、我々は、このインタフェースの実装を宣言します。コンパイラは、唯一の正しい種類（パラメータの型、戻り値の型）、私たちは別のものに交換することが可能なパラメータの名前の由来を調べます。

配列型

在前面一节中我们学习了接口定义方法类型，这一节我们来学习接口定义数组类型。在数组类型中有一个“index”类型其描述数组下标的类型，以及返回值类型描述每项的类型。如下：

interface StringArray { //定义数组接口
  [index: number]: string;  //每个数组元素的类型
}
var myArray: StringArray; 
myArray = ["Bob", "Fred"];

インターフェイス内部の定義では、インデックスの名前は、一般的にインデックスが（もちろん、他に変更することができるが、一般的にするための名前を維持されている
　　インデックス）。タイプインデクサは数値または文字列を指定できます。

interface Array{
  [myindex: number]: number;
}
interface Dictionary{
  [index: string]: any;
}

クラスタイプ

そして、Javaの型システムではC＃のインターフェイスは、非常に多くの場合、彼らのクラスと一致し、その実装を契約することを余儀なくされ、使用されています。同じ缶はまた、器具キーワードクラスを使用するインタフェースを実装することにより、活字体で達成します。次のコード：

interface IPrint{
  print();
}
class A implements IPrint  { //实现接口
  print(){  //实现接口中的方法
      document.write("实现接口");
  }
}
var B=new A();  
B.print();

インターフェイスの継承

そして、クラス、インターフェイスは、他のインターフェイスを継承することができます。これは、複製インターフェイスのすべてのメンバーに相当します。インターフェイスもキーワード「拡張」に継承さ。

interface Shape {     //定义接口Shape
    color: string;
}
interface Square extends Shape {  //继承接口Shape
    sideLength: number;
}

インターフェースは、結合メンバーを達成するために、複数の同時インターフェース、複数のインタフェースを継承することができます。継承インターフェイスにカンマで区切って指定します。

interface Shape {
    color: string;
}
 
interface PenStroke {
    penWidth: number;
}
 
interface Square extends Shape, PenStroke {
    sideLength: number;
}

複数のインタフェースを継承をサポートしているが、ことに留意すべきであるが、継承されたインターフェイス、プロパティの型と同じ名前の異なる定義は、それがコンパイラによって採用されていない場合。次のコード：

interface Shape {
    color: string;
    test: number;
}
 
interface PenStroke extends Shape{
    penWidth: number;
    test: string;
}

活字体モジュール

声明モジュール

フロントエンドのデータ検証は、ユーザーエクスペリエンスの改善に重要な役割を果たしている、知識は以前、我々は次のコードを記述する可能性がある学びました。

interface StringValidator {  //定义验证接口
  isAcceptable(s: string): boolean;
}
 
var lettersRegexp = /^[A-Za-z]+$/;
var numberRegexp = /^[0-9]+$/;
 
class LettersOnlyValidator implements StringValidator {　//实现接口
  isAcceptable(s: string) {
    return lettersRegexp.test(s);
  }
}
 
class ZipCodeValidator implements StringValidator {   //实现接口
  isAcceptable(s: string) {
    return s.length === 5 && numberRegexp.test(s);
  }
}
 
var strings = ['Hello', '98052', '101'];
var validators: { [s: string]: StringValidator; } = {};
validators['ZIP code'] = new ZipCodeValidator();  //实例化类
validators['Letters only'] = new LettersOnlyValidator(); //实例化类
for(var i=0;i<strings.length;i++){
    for (var name in validators) {
       document.write('"' + strings[i] + '" ' + (validators[name].isAcceptable(strings[i]) ? ' matches ' : ' does not match ') + name+"<br>"); //调用类的方法
    }
}

だから、このコードの最大の問題は、それが何であるのか？多重化は、パッケージを多重化することが確認されている、同じパッケージファイルでは不可能、認証および検証プロセスです。複数の番号場合や、他の二つのインタフェースは、直接接続されたグローバル変数に基づいて実装されている、それが全体のグローバル変数に影響を与えます。この問題を解決するために、私たちにモジュールの登場。使用は、モジュールを定義するキーワード、およびエンドアド括弧で使用することができる、とキーワードインタフェース、クラス、およびその他の目に見える外側のモジュールのメンバーように。
TypeScritpmoduleexport

module Validation {   //定义模块
  export interface StringValidator {  //声明接口对外部可以使用
    isAcceptable(s: string): boolean;
  }
 
  var lettersRegexp = /^[A-Za-z]+$/;
  var numberRegexp = /^[0-9]+$/;
 
  export class LettersOnlyValidator implements StringValidator {  //声明类对外部可用
    isAcceptable(s: string) {
      return lettersRegexp.test(s);
    }
  }
 
  export class ZipCodeValidator implements StringValidator {
    isAcceptable(s: string) {
      return s.length === 5 && numberRegexp.test(s);
    }
  }
}

モジュールコンテンツを呼び出します

前のセクションでは、私は宣言モジュール、およびステートメントが完了した後、モジュールを学んだ、私たちは、クラス、メソッド、およびその上で、このモジュールは、呼び出しモジュールのインターフェイスを呼び出すことができます。メソッドを呼び出し、それが使用することです、簡単です模块名后面跟一个点ので、上のクラス、インタフェース、メソッド、およびを呼び出すこと。次のコード：

module Validation {  //定义模块
  export interface StringValidator {  //声明接口对外部可以使用
      isAcceptable(s: string): boolean;
  }
 
  var lettersRegexp = /^[A-Za-z]+$/;
  var numberRegexp = /^[0-9]+$/;
 
  export class LettersOnlyValidator implements StringValidator { //声明类对外部可用
    isAcceptable(s: string) {
      return lettersRegexp.test(s);
    }
  }
 
  export class ZipCodeValidator implements StringValidator {
    isAcceptable(s: string) {
      return s.length === 5 && numberRegexp.test(s);
    }
  }
}
 
var strings = ['Hello', '98052', '101'];
var validators: { [s: string]: Validation.StringValidator; } = {};
validators['ZIP code'] = new Validation.ZipCodeValidator();  //使用模块中的类
validators['Letters only'] = new Validation.LettersOnlyValidator();
// 显示匹配结果
for(var i=0;i<strings.length;i++){
  for (var name in validators) {
     document.write('"' + strings[i] + '" ' + (validators[name].isAcceptable(strings[i]) ? ' matches ' : ' does not match ') + name+"<br>"); // 使用方法
    }
}

複数のファイルにモジュールを分割します

私たちのプロジェクトの拡大に伴い、私たちは常にただのファイルにコードを記述することはできません。プロジェクトよりよく保護するために、我々は、特定の関数ファイルを置いて、我々は必要な機能を実現したい複数のファイルをロードします。今、上記のコードは、まず、複数のファイルに分割します。
Validation.ts

module Validation {
  export interface StringValidator {
      isAcceptable(s: string): boolean;
  }
}

LettersOnlyValidator.ts

/// <reference path="Validation.ts" />
module Validation {
  var lettersRegexp = /^[A-Za-z]+$/;
  export class LettersOnlyValidator implements StringValidator {
      isAcceptable(s: string) {
        return lettersRegexp.test(s);
      }
  }
}

ZipCodeValidator.ts

/// <reference path="Validation.ts" />
module Validation {
  var numberRegexp = /^[0-9]+$/;
  export class ZipCodeValidator implements StringValidator {
    isAcceptable(s: string) {
      return s.length === 5 && numberRegexp.test(s);
    }
  }
}

Test.ts

/// <reference path="Validation.ts" />
/// <reference path="LettersOnlyValidator.ts" />
/// <reference path="ZipCodeValidator.ts" />
var strings = ['Hello', '98052', '101'];
var validators: { [s: string]: Validation.StringValidator; } = {};
validators['ZIP code'] = new Validation.ZipCodeValidator();
validators['Letters only'] = new Validation.LettersOnlyValidator();
for(var i=0;i<strings.length;i++){
  for (var name in validators) {
     document.write('"' + strings[i] + '" ' + (validators[name].isAcceptable(strings[i]) ? ' matches ' : ' does not match ') + name+"<br>"); //调用类的方法
    }
}

我々は正確にコードを書いた場合、新しいプロジェクト、良い四個の以上のファイルでは、その後、我々はプロジェクトをコンパイル、コンパイラは合格することができます。また、私たちが伝えている、次の3つのファイルの先頭には、同様のC＃のドキュメンテーションコメントを持つ見ることができますTypeScript依存のファイルが存在しない場合は、ファイルがどのファイルに依存していることをコンパイラに、コンパイラは渡しません。もちろん、我々は可能性も書き込みませんが、コンパイル時のチェックで、コンパイラは、一般的に、私たちを助けにはなりません、上の書き込みをすることをお勧めします。コンパイルされたJavaScriptファイルを参照する際に加えて、我々は良い順番に注意を払う必要があります。上記のコードでは、例えば、我々は、HTMLコードで非常に多くの参照を持っています。

<script src="Validation.js" type="text/javascript"/>
<script src="LettersOnlyValidator.js" type="text/javascript"/>
<script src="ZipCodeValidator.js" type="text/javascript"/>
<script src="Test.js" type="text/javascript"/>

lucasxt

公開された42元の記事・ウォンの賞賛4 ・ビュー4623

プライベートの手紙の懸念

研究ノート-TypeScript

活字体