typescript 知识点文档笔记

• 类型注解

// TypeScript里的类型注解是一种轻量级的为函数或变量添加约束的方式。 比如在这个例子里，我们希望 greeter函数接收一个字符串参数
function greenter(person: string){
    return `hello, ${person}`
}

在变量或者参数后面跟限定的类型即可，如果不限定，可以使用 any 表示任何类型都可以，如果在使用时给定不符合限定的类型，编译时会报错提醒，但是不影响编译结果。只是代码可能不会按预期执行，另外也使用noEmitOnError选项来控制出错不编译

• 接口 

interface Person{
    firstName?: String,
    lastName: string
}
// ? 表示可能存在该属性

function greenter1({firstName, lastName}: Person){
    return `${firstName}, ${lastName}`
}

只读属性：在类型声明时同时声明 readonly 可使参数在创建后无法修改

TypeScript具有ReadonlyArray<T>类型，它与Array<T>相似，只是把所有可变方法去掉了，因此可以确保数组创建后再也不能被修改  

let a: ReadonlyArray<number> = [1,2,3,4]

• 类

  • protected ： 可在派生类访问，构造函数也可以被标记成 protected。 这意味着这个类不能在包含它的类外被实例化，但是能被继承。既不能直接 new 实例
  • private ：兼容比较时两个类派生自同一个基类，且 private 修饰符不能在类外访问

  • readonly ： 只读属性必须在声明时或构造函数里被初始化

派生类通常被称作 子类，派生类需要执行super()来执行基类的构造函数

基类通常被称作 超类，派生类 通过 extends关键字 派生自基类

抽象类做为其它派生类的基类使用。 它们一般不会直接被实例化。 不同于接口，抽象类可以包含成员的实现细节。abstract关键字是用于定义抽象类和在抽象类内部定义抽象方法

abstract class Animal {
    // 抽象类中的抽象方法不包含具体实现并且必须在派生类中实现
    abstract makeSound(): void;
    move(): void {
        console.log('roaming the earch...');
    }
}

class Student {
    _fullname: string;
    // 要注意的是，在构造函数的参数上使用修饰符等同于创建了同名的成员变量。
    constructor(public firstName, middleIntial, public lastName){
        this._fullname = `${firstName}${middleIntial}${lastName}`
    }
    get fullName(): string {
        return this._fullname;
    }

    set fullName(newName: string) {
        this._fullName = newName;
    }

}

const user = new Student('jack', '+', 'linlin')

function greenter(person: Person){
    return `${person.firstName}, ${person.lastName}`
}

greenter(user)

• 引入文件方式

// 引入文件方式 Node/CommonJS 、 RequireJS/AMD
import foo = require('./ts1')
foo.fo()

// 编译后
"use strict";
exports.__esModule = true;
var foo = require("./ts1");
foo.fo(); 

或者

// 引入文件方式 ES6
import foo from './ts1'
foo.fa()

// 编译后
"use strict";
exports.__esModule = true;
var ts1_1 = require("./ts1");
ts1_1["default"].fa();

导出文件

//  以前导出对象直接调用可以使用 module.exports = foo   foo 为function
// 在TS里，可以使用 export = foo
function foo(){}
export = foo


// 编译后
function foo() { }
module.exports = foo;

• 函数重载

在使用函数的时候，可能有多个参数，如果是不确定调用者的意图，无法确定传参的类型，可以使用 arguments 来模拟其他语言的重载特性

function myCoolFunction() {
    if (arguments.length == 2 && !Array.isArray(arguments[1])) {
        var f = arguments[0];
        var arr = arguments[1];
        // ...
    }
    // ...
}

上面这个例子中，第二个参数可以是数组，也可以不是，这种情况下，我们需要利用TypeScript的函数重载来告诉调用者myCoolFunction函数的调用方式

function myCoolFunction(f: (x: number) => void, nums: number[]): void;
function myCoolFunction(f: (x: number) => void, ...nums: number[]): void;
function myCoolFunction() {
    if (arguments.length == 2 && !Array.isArray(arguments[1])) {
        var f = arguments[0];
        var arr = arguments[1];
        // ...
    }
    // ...
}

这里为myCoolFunction函数添加了两个重载签名。 第一个检查 myCoolFunction函数是否接收一个函数（它又接收一个number参数）和一个number数组。 第二个同样是接收了一个函数，并且使用剩余参数（...nums）来表示之后的其它所有参数必须是number类型。

转载于:https://my.oschina.net/mdu/blog/3071012