TypeScript相关

What

TypeScript 是 JavaScript 的一个超集，支持 ECMAScript 6 标准。TypeScript 是由微软开发的自由和开源的编程语言。TypeScript 设计目标是开发大型应用，它可以编译成纯 JavaScript，编译出来的 JavaScript 可以运行在任何浏览器上。

install

推荐VS Code ，atom 需要安装 atom-typescript包，sublime需要安装Typescript-sublime-plugin。

全局安装：npm install typescript -g
创建.ts结尾的文件
在命令行中执行tsc+项目文件名,这个命令可以将我们写好的ts代码编写成JavaScript代码,并且进行数据类型检查（如tsc hello.ts）

变量声明

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

var uname:string = "Runoob";

基础类型

字符串
和JavaScript一样,可以使用双引号("")和单引号('')表示字符串
let name: string = 'jack'
name = "lili"
还可以使用模板字符串
let hello = hello my name is ${name}
元组
元组类型允许表示一个已知元素数量和类型的数组,各元素的类型不必相同.

let arr: [string, number]
arr = ['li', 5]                //对
arr = [5, 'li']                //错

枚举
枚举是一个可被命名的整型常数的集合，枚举类型为集合成员赋予有意义的名称，增强可读性

enum Color {Red, Green, Blue};
let c: Color = Color.Blue;
console.log(c);    // 输出 2

枚举默认下标是0，可以手动修改默认下标值

enum Color {Red = 2, Blue, Green = 6};
let c: Color = Color.Blue;
console.log(c);    // 输出：3

任意值any
不清楚变量类型,并且希望在编译的时候不进行检查.使用any任意类型来标记这些变量

let anyVariable:any = 4
anyVariable = 'hello'

Never
表示的那些永不存在的值的类型。
never类型是任何类型的子类型，也可以赋值给任何类型；然而，没有类型是never的子类型或可以赋值给never类型（除了never本身之外）。即使any也不可以赋值给never。

// 返回never的函数必须存在无法达到的终点
function error(message: string): never {
      throw new Error(message);
}
// 推断的返回值类型为never
function fail() {
      return error("Something failed");
}
// 返回never的函数必须存在无法达到的终点
function infiniteLoop(): never {
      while (true) {}
}

Object
表示非原始类型，也就是除number，string，boolean，symbol，null或undefined之外的类型。

declare function create(o: object | null): void;
create({ prop: 0 }); // OK
create(null); // OK
create(42); // Error
create("string"); // Error
create(undefined); // Error

类型断言
类型断言有两种形式。其一是“尖括号”语法,另一个为as语法：

let someValue: any = "this is a string";
let strLength: number = (someValue).length;

let someValue: any = "this is a string";
let strLength: number = (someValue as string).length;

接口

TS 里接口可以描述变量、函数类型和类类型，其它语言只能描述类类型。接口描述变量时可以使用'？'定义某个变量为可选变量。比如对某个对象进行约束时，如果对象的某个属性设置成了可选，则传入的对象可以不包含这个属性。

interface LabelledValue {
    size?: Number,
    label: String
}

function printLabel(labelObject: LabelledValue) {
    return labelObject.label;
}

// 由于size设置成了可选变量，则传入的对象可以不包含size属性
console.log(printLabel({
    label: 'size 1 object'
}));

接口-描述函数类型

interface SearchFunc {
    (source: string, subString: string): boolean;
}
let mySearch: SearchFunc;
mySearch = function(src: string, sub: string): boolean {
  let result = src.search(sub);
  return result > -1;
}

对于函数类型的类型检查来说，函数的参数名不需要与接口里定义的名字相匹配。

接口 - 描述类类型

不同于别的语言只能定义函数，TS里还可以定义属性。如果某个类继承了这个接口，那么这个类必须包含接口里定义的属性和方法。

interface ClockInterface {
    currentTime: Date;
    setTime(d: Date): any;
}
class Clock implements ClockInterface {
    currentTime = new Date();
    setTime(d: Date) {
        this.currentTime = d;
    }
    constructor(h: number, m: number) { }
}

装饰器

Decorator是一个函数，用来修饰类、属性、方法和参数。使用 @expression 。

function color(value: string) { // 这是一个装饰器工厂
    return function (target) { //  这是装饰器
        // do something with "target" and "value"...
    }
}

类装饰器
@func 修饰类A 等价于 A = func(A)，相当于把旧class转换成了新的class。可以理解为一个加工函数，它接受一个类，加工后返回另一个类。

//使用类装饰器(@sealed)的例子，应用在Greeter类：
@sealed
class Greeter {
    greeting: string;
    constructor(message: string) {
        this.greeting = message;
    }
    greet() {
        return "Hello, " + this.greeting;
    }
}
//定义@sealed装饰器：
function sealed(constructor: Function) {
    Object.seal(constructor);
    Object.seal(constructor.prototype);
}

方法装饰器

//方法装饰器（@enumerable），应用于Greeter类的方法上：
class Greeter {
    greeting: string;
    constructor(message: string) {
        this.greeting = message;
    }

    @enumerable(false)
    greet() {
        return "Hello, " + this.greeting;
    }
}
//可以用下面的函数声明来定义@enumerable装饰器：
function enumerable(value: boolean) {
    return function (target: any, propertyKey: string, descriptor: PropertyDescriptor) {
        descriptor.enumerable = value;
    };
}