TypeScript擴充套件了JavaScript的語法，所以任何現有的JavaScript程式可以不加改變的在TypeScript下工作。TypeScript是為大型應用之開發而設計，而編譯時它產生 JavaScript 以確保相容性。

關於除錯

自動拆分字串

function test(template, name, age) {
    console.log(template);
    console.log(name);
    console.log(age);
}

var myName = "zx";
var getAge = () => 20;

//
 
可以這樣呼叫test函式
test`Hello, my name is ${myName}, I am ${getAge()} years old`;

編譯後的javascript程式碼

function test(template, name, age) {
    console.log(template);
    console.log(name);
    console.log(age);
}
var myName = "zx";
var getAge = function () { return 20; };
//可以這樣呼叫test函式
(_a = ["Hello, my name is "
 
, ", I am ", " years old"], _a.raw = ["Hello, my name is ", ", I am ", " years old"], test(_a, myName, getAge()));
var _a;

引數型別

宣告變數時指定型別

var myName: string = 'zx';
console.log(typeof myName);  // string

myName = 20; // 報錯，因為已經宣告為string型別

常見的資料型別：

- Boolean：布林型別
- Number：TypeScript所有的數值型別採用浮點型計數
- String：字串型別
- Array：陣列
- Enum：列舉
- Any：任何型別，可以用來跳過TypeScript的編譯時型別的檢查
- void：表明函式無返回值
 

自定義型別

class Person {
    name: string;
    age: number;
}

var people: Person = new Person();

console.log(zx); // Person

編譯後的javascript程式碼

var Person = (function () {
    function Person() {
    }
    return Person;
}());
var zx = new Person('zx', 10);
console.log(zx);

給引數指定預設值

function test(a: string = 'zx') {
    console.log(a);
}

test();     // zx
test('xz'); // xz

編譯後的javascript程式碼

function test(a) {
    if (a === void 0) { a = 'zx'; }
    console.log(a);
}
test();
test('xz');

可選引數

function test(a: string, b?:string) {
    console.log(a);
    console.log(b);
}

引數b的後面有個?，這就聲明瞭b是可選的。

Rest and Spread 操作符

function test(...args) {
    console.log(args);
}

test(1, 2,  3); // 控制檯輸出Array(4)

注意控制檯輸出Array(4)，這說明 …args 是真正的陣列，而不是類似陣列的物件。
（可以用 Array.form() 轉換類似陣列的物件）

generator函式

示例

function* log() {
    console.log(1);

    yield console.log(2);

    console.log(3);
    console.log(4);

    yield console.log(5);

    console.log(6);
}

let fun = log();

fun.next(); // 1 2

fun.next(); // 3 4 5

fun.next(); // 6

通過示例應該可以看出：
- 用 function* 宣告一個generator函式
- 在其內的程式碼以 yield 為一個斷點
- 呼叫 generator 函式需要使用一個輔助變數，並通過 next() 來執行一次（到斷點即停）

意義

關於這種函式的意義當然是用經典的股票來說明：

function* getLowerPrice() {
  while (true) {
    yield Math.ceil(Math.random() * 100);
  }
}

let test = getLowerPrice(),
    price = 100,
    targetPrice = 20;

while (price > targetPrice) {
    price = test.next().value;
}

console.log("Oh, yeah! I get the lowest price ", price);

你會看到輸出一個比20小的數字，這就是意義？

迴圈

let arr = [2, 4, 6, 8];

arr.desc = '我還是陣列？';

// forEach
arr.forEach(x => x > 2 ? console.log(x) : null); // 4 6 8

// for in 
for (let index in arr) {
    console.log(index);  
}
// 輸出 0 1 2 3 desc （顯然 forin 是迴圈獲取下標，但是desc？）

// for of 
for (let item of arr) {
    console.log(item);
}
// 輸出 2 4 6 8 （沒有desc）

從上面可以看出一個 forin 的弊端（也許不是），它打印出了 desc （顯然不是陣列下標）。

泛型

舉個例子：

let people: Array<Person> = [];

這就聲明瞭一個數組，該陣列只能存放Person型別資料。

類

宣告一個類

class Person {
    name;
    age: number = 20;

    getAge () {
        console.log(this.age);
    }
}

let zx = new Person();
zx.getAge(); // 20

屬性修飾符

與java類似：

- public
- protect
- private

建構函式

統一為：

constructor () {

}

舉個例子：

class Person {
    private name: string;
    private age: number;

    constructor (name, age) {
        this.name = name;
        this.age = age;
    }

    log () {
        console.log(this.name);
        console.log(this.age);
    }
}

let zx = new Person('zx', 20);
zx.log(); // zx 20

let txj = new Person('txj', 13);
txj.log(); // txj 13

繼承

自然是關鍵字 extends 。

舉個例子：

class Father {
    private name: string;
    private age: number;

    constructor(name, age) {
        this.name = name;
        this.age = age;
    }

    log () {
        console.log(this.name);
        console.log(this.age);
    }
}

class Son extends Father {
  private privateMoney: number;

    constructor(name, age, privateMoney) {
    super(name, age);
    this.privateMoney = privateMoney;
  }

  showOff() {
    console.log("You do not know my private money! ", this.privateMoney);
  }
}


let txj = new Father('txj', 13);
txj.log();

let zx = new Son('zx', 20,  10);
zx.log();
zx.showOff();

可以看到子類擁有父類的屬性和方法，但是父類就不能擁有子類自己的方法。

介面

關鍵字 interface。
舉個例子：

interface Human {
    sex: string;
}

class Person {
  name: string;
    constructor (public sex : Human, name) {
        this.sex = sex;
    this.name = name;
    }
}

let zx = new Person({sex : 'male'}, 'zx');

這就硬性規定了應傳入的引數。

當然也可規定必須實現的方法：

interface Animal {
    eat();
}

class Dog implements Animal {
    eat () {
        console.log('I am eating');
    }
}