TS学习笔记4-类

122 阅读3分钟

1、定义一个基础的类

先定义一个普通的类

class Person {
  name: string
  constructor(name: string) {
    this.name = name
  }
  speak() {
    console.log(this.name)
  }
}
const a = new Person('zhangsan')
console.log(a.name)
a.speak()

2、继承

定义一个子类继承上面的类

class RichPeople extends Person {
  earnMoney() {
    console.log('$$$$')
  }
}
const b = new RichPeople('zhangsan')
console.log(b.name)
b.speak()
b.earnMoney()

如果子类有自己的属性 就需要用super来继承父组件的属性

class student extends Person {
  grade: number
  constructor(name: string, grade: number) {
    super(name);
    this.grade = grade
  }
}
const c = new student('lisi', 100)
console.log(c.grade, c.name)
c.speak()

3、多态

子类可以重写父类方法。

下面重写父类的speak方法。

class student extends Person {
  grade: number
  constructor(name: string, grade: number) {
    super(name);
    this.grade = grade
  }
  speak() {
    console.log(this.name + ':' + this.grade)
  }
}
const c = new student('lisi', 100)
c.speak()

4、public、private、protected

TS新增了public、private、protected这三个修饰符

public,公有的,一个类里默认所有的方法和属性都是 public,public 可写可不写,不写默认也是 public。

private,私有的,只属于这个类自己,它的实例和继承它的子类都访问不到。

protected 受保护的,继承它的子类可以访问,实例不能访问。

class Person {
  public name: string
  private xp: string
  protected money: number
  public constructor(info: { name: string, money: number }) {
    this.name = info.name
    this.xp = "???"
    this.money = info.money
  }
  public speak() {
    console.log(this.name, this.xp, this.money)
  }
}
const a = new Person({ name: 'wangwu', money: 1000000 })

image.png

Person的实例只能访问到public标识的属性与方法,private标识的px与protected的money属性都是在实例上访问不到的。

写一个子类

image.png

可以看到子类可以拿到父类publicprotected的标识的属性与方法,private标识的px是拿不到的。

创建一个子类的实例

image.png

可以看到在实例上我们和父类的实例一样,只能访问到public标识的属性与方法

static 是静态属性,可以理解为是类上的一些常量,实例不能访问。

class Circle {
  static pi = 3.14
  public radius: number
  public constructor(radius: number) {
    this.radius = radius
  }
  public calcLength() {
    // 这个地方只能是Circle.pi而不是this.pi
    return Circle.pi * this.radius * 2
  }
}

实例不能访问 image.png

5、抽象类

TS 对 JS 扩展了一个新概念————抽象类

抽象类,是指只能被继承,但不能被实例化的类

抽象类有两个特点,抽象类不能被实例化,还有就是抽象类的抽象方法必须被子类实现。

抽象类的用法是用来定义一个基类,声明共有属性和方法,拿去被继承。

抽象类的好处是可以抽离出事物的共性,有利于代码的复用。

抽象类用一个 abstract 关键字来定义

abstract class Animal {
    getName(){}
}
const a = new Animal()

不能直接实例化抽象类

image.png

abstract class Animal { 
    abstract a():void
}
class Dog extends Animal {}

子类必须实现抽象类的抽象函数

image.png

6、this

类的成员方法可以直接返回一个 this,这样就可以很方便地实现链式调用。

class Animal { 
    a(){ return this}
    b(){ return this}
}
const x = new Animal();
x.a().b().a()

在继承的时候 this可以表示父类也可以表示子类,可以随意调用

class Animal { 
    a(){ return this}
    b(){ return this}
}
const x = new Animal();
x.a().b().a()
class Pig extends Animal{
    c(){return this}
}
const x2 = new Pig();
x2.c().a().c().b()

7、interface 定义 class

interface使用implements来约束类

interface Pig {
  eat(): void
}
class bigPig implements Pig{}

这时候bigPig会报错,因为没有实现eat函数

image.png

下面就不报错了

class bigPig implements Pig {
  eat() {

  }
}

可以使用多个interface来限制class

interface Pig {
  eat(): void
  name: string
}
interface Hero {
  speak(): void
}
class pigHero implements Pig, Hero {
  name: string
  constructor(name: string) {
    this.name = name
  }
  eat() { }
  speak() { }
}

如果想要约束类的构造方法和静态的属性 需要换一种写法,必须全部实现interface内的内容,不然会报错。

interface Pig {
  size: string
  new(name: string): void
}
const bigPig: Pig = class pigHero {
  static size: 'big'
  constructor(name: string) {
  }
}