TypeScript 学习笔记 —— （四）

此笔记记录的是 尚硅谷TypeScript教程（李立超老师TS新课） 课程笔记

类

• 使用 static 开头的属性是静态属性（类属性），可以直接通过类去访问
• readonly 开头的属性表示一个只读的属性，无法修改

抽象类

• 以 abstract 开头的类是抽象类
• 抽象类和其它类区别不大，只是不能用来创建对象
• 抽象类就是专门用来被继承的类

abstract class Animal {
    ...
}

• 抽象类中可以添加抽象方法
  1. 定义一个抽象方法
  2. 抽象方法使用 abstract 开头，没有方法体
  3. 抽象方法只能定义在抽象类中，子类必须对抽象方法进行重写

abstract class Animal {
    abstract sayHello():void;
}

接口

• 接口用来定义一个类结构，用来定义一个类中应该包含哪些属性和方法，同时接口也可以当成类型声明去使用，类似于 type

interface myInterface {
    name: string;
    age: number;
}

const obj: myInterface = {
    name: 'sss',
    age: 111
}

• ts 中可以定义两个相同的接口，那么使用时，就要把二者结合起来，都要实现

interface myInterface {
    name: string;
    age: number;
}

interface myInterface {
    gender: string;
}

const obj: myInterface = {
    name: 'sss',
    age: 111,
    gender: '男'
}

• 接口可以在定义类的时候去限制类的结构
• 接口中的所有的属性都不能有实际的值
• 接口只定义对象的结构，而不考虑实际值
• 在接口中，所有的方法都是抽象方法

interface myInter {
    name: string;
    
    sayHello():void;
}

• 定义类时，可以使类去实现一个接口，用 implements 关键字
• 实现接口就是使类满足接口的要求

class MyClass implements myInter {
    name: string;
    
    constructor(name: string) {
        this.name = name;
    }
    
    sayHello(){
        console.log('Hello everyone~');
    }
}

属性修饰符

1. public 修饰的属性可以在任意位置访问（修改）默认值
2. private 私有属性，只能在类内部进行访问（修改），通过在类中添加方法使得私有属性可以被外部访问
3. protected 受保护的属性，只能在当前类和当前类的子类中访问

属性的一个语法糖

1. 写法一：

class Person {
    name: string;
    age: number
    
    constructor(name: string, age: number) {
        this.name = name;
        this.age = age;
    }
}

2. 写法二：

class Person {    
    constructor(public name: string, public age: number) {
    }
}

泛型

• 在定义函数或是类时，如果遇到类型不明确，就可以使用泛型
  • fn<T> 这里的 T 是指定义了一个泛型，叫 T，名字无所谓（也可以叫 K 或者其它）
  • fn<T>(a: T) 中，由于 fn<T> 中定义了 T，因此可以对 a 使用 T 来规定类型，表示 a 的类型是 T

function fn<T>(a: T): T {
    return a;
}

• 可以直接调用具有泛型的函数

fn(10); // 不指定泛型，TS 可以自动对类型进行推断
fn<string>('hello'); // 指定泛型

// 也可以定义两个泛型
function fn2<T, K>(a: T, b: K): T {
    console.log(b);
    return a;
}
fn2<number, string>(123, 'hello');

• T extends Inter 表示泛型 T 必须是 Inter 实现类（子类）

interface Inter {
    length: number;
}

function fn3<T extends Inter>(a: T): number {
    return a.length;
}

fn3('123');

• 除了在函数中可以使用泛型，在类中也可以使用泛型

class MyClass<T> {
    name: T;
    constructor(name: T) {
        this.name = name;
    }
}
// 下面两种方式都可以
const mc = new MyClass('Lily');
const mc1 = new MyClass<string>('Bob');