TypeScript 是 JavaScript 的超集，扩展了 JavaScript 的语法

1 基础

1.1 基础语法

• ts区分大小写
• 每行算一个语句，分号可以不写但是不建议不写，同一行加分号区分两个语句

面向对象编程示例

class Site { 
   name():void { 
      console.log("Runoob") 
   } 
} 
var obj = new Site(); 
obj.name();

1.2 基础类型

变量申明：

var [变量名] : [类型] = 值;

未设置初始值则为undefined，未设置类型则为any

注：变量不要使用 name 否则会与 DOM 中的全局 window 对象下的 name 属性出现了重名。

类型断言：让变量从一种类型更改为另一种类型。

语法格式：

<类型>值//子集才能断言

或:

值 as 类型

1.3函数

返回值：

function function_name():return_type { 
    // 语句
    return value; 
}

带参数

function add(x: number, y: number): number {
    return x + y;
}

可选参数

function buildName(firstName: string, lastName?: string) {
    if (lastName)
        return firstName + " " + lastName;
    else
        return firstName;
}

let result1 = buildName("Bob");  // 正确
let result2 = buildName("Bob", "Adams", "Sr.");  // 错误，参数太多了
let result3 = buildName("Bob", "Adams");  // 正确

默认参数

function calculate_discount(price:number,rate:number = 0.50) { 
    var discount = price * rate; 
    console.log("计算结果: ",discount); 
} 
calculate_discount(1000) 
calculate_discount(1000,0.30)

剩余参数

function buildName(firstName: string, ...restOfName: string[]) {
    return firstName + " " + restOfName.join(" ");
}//以...为前缀则成为剩余参数组成的数组

let employeeName = buildName("Joseph", "Samuel", "Lucas", "MacKinzie");

箭头函数：

var foo = (x:number)=>10 + x  console.log(foo(100))      //输出结果为 110

编译以上代码，得到以下 JavaScript 代码：

var foo = function (x) { 
    return 10 + x; 
}; 
console.log(foo(100)); //输出结果为 110

不指定x的类型时：

var func = (x)=> { //单个参数括号可以去掉，无参数则设置空括号
    if(typeof x=="number") { 
        console.log(x+" 是一个数字") 
    } else if(typeof x=="string") { 
        console.log(x+" 是一个字符串") 
    }  
} 
func(12) 
func("Tom")

参数重载：

function disp(s1:string):void; 
function disp(n1:number,s1:string):void; 

function disp(x:any,y?:any):void { 
    console.log(x); 
    console.log(y); 
} 
disp("abc") 
disp(1,"xyz");

编译后：

function disp(x, y) {
    console.log(x);
    console.log(y);
}
disp("abc");
disp(1, "xyz");

1.4 数组

var arr:
number[] = [12,13] 
var[x,y] = arr // 将数组的两个元素赋值给变量 x 和 y 
console.log(x)
console.log(y)

编译以上代码，得到以下 JavaScript 代码：

var arr = [12, 13];
var x = arr[0],  y = arr[1]; // 将数组的两个元素赋值给变量 x 和 y 
console.log(x); 
console.log(y);

1.5 联合类型

var val:string|number  //一个变量多个类型
val = 12 
console.log("数字为 "+ val) 
val = "Runoob" 
console.log("字符串为 " + val)

2 面向对象

2.1 接口

编译为js后接口部分就没了，单纯就是个规范吧。。

interface IPerson { 
    firstName:string, 
    lastName:string, 
    sayHi: ()=>string 
} 

var customer:IPerson = { 
    firstName:"Tom",
    lastName:"Hanks", 
    sayHi: ():string =>{return "Hi there"} 
} 

接口继承

Child_interface_name extends super_interface_name

继承的多个接口使用逗号 , 分隔

2.2 类

2.2.1 基本使用

class class_name { 
    // 类作用域
    // 字段 
    engine:string; 

    // 构造函数 
    constructor(engine:string) { 
        this.engine = engine 
    }  

    // 方法 
    disp():void { 
        console.log("发动机为 :   "+this.engine) 
    } 
}

instanceof 运算符：运算符用于判断对象是否是指定的类型，是则返回true，否则返回false

2.2.2 继承

class Shape { 
   Area:number 

   constructor(a:number) { 
      this.Area = a 
   } 
} 

class Circle extends Shape { 
   disp():void { 
      console.log("圆的面积:  "+this.Area) 
   } 
}

var obj = new Circle(223); 
obj.disp()
//圆的面积:  223

子类只能继承一个父类，TypeScript 不支持继承多个类，但支持多重继承

class Child extends Root {} 
class Leaf extends Child {} // 多重继承，继承了 Child 和 Root 类

2.2.3 方法重写

class PrinterClass { 
   doPrint():void {
      console.log("父类的 doPrint() 方法。") 
   } 
} 

class StringPrinter extends PrinterClass { 
   doPrint():void { 
      super.doPrint() // 调用父类的函数
      console.log("子类的 doPrint()方法。")
   } 
}

2.2.4 static关键字

class StaticMem {  
   static num:number; 

   static disp():void { 
      console.log("num 值为 "+ StaticMem.num) 
   } 
} 

StaticMem.num = 12     // 初始化静态变量
StaticMem.disp()       // 调用静态方法

使得静态成员可以通过类名被调用

2.2.5 访问控制修饰符：

• public（默认） : 公有，可以在任何地方被访问。
• protected : 受保护，可以被其自身以及其子类访问。
• private : 私有，只能被其定义所在的类访问。

class Encapsulate { 
   str1:string = "hello" 
   private str2:string = "world" 
}

var obj = new Encapsulate() 
console.log(obj.str1)     // 可访问 
console.log(obj.str2)   // 编译错误， str2 是私有的

2.2.6 实现接口

interface ILoan { 
   interest:number 
} 

class AgriLoan implements ILoan { 
   interest:number 
   rebate:number 

   constructor(interest:number,rebate:number) { 
      this.interest = interest 
      this.rebate = rebate 
   } 
} 

var obj = new AgriLoan(10,1) 
console.log("利润为 : "+obj.interest+"，抽成为 : "+obj.rebate )

2.3 命名空间

就是个对象，但是不调用就不能用

namespace SomeNameSpaceName { 
  //暴露接口 
   export interface ISomeInterfaceName {      }  
   export class SomeClassName {      }  
}

外部要调用需要用接口暴露，另一个命名空间调用要用：

SomeNameSpaceName.SomeClassName;

调用其他ts文件的命名空间需要

/// 

2.4 模块

import了才可以调用

2.5 声明文件

引用其他第三方的库时，若要使用typescript内的类型检查之类的特性功能，可以通过declare来进行编译时的检查，编译之后将会删除

建立一个后缀为.d.ts的申明文件

declare module Runoob { 
   export class Calc { 
      doSum(limit:number) : number; //申明calc内的doSum函数传入参数类型要限制为number
   }
}