【Typescript基础】类的使用-EW帮帮网

$\color{#0000FF}{多一些不为什么的坚持}$ 🙊

$\color{#FF0000}{贤蛋 🥚大眼萌，一名很普通但不想普通的程序媛}$ 🤳

📝本文章收录于专栏：Typescript学习

类的使用

⚙️ 认识类的使用

在早期的JavaScript开发中（ES5）我们需要通过函数和原型链来实现类和继承，从ES6开始，引入了class关键字，可以更加方便的定义和使用类。

TypeScript作为JavaScript的超集，也是支持使用class关键字的，并且还可以对类的属性和方法等进行静态类型检测。

在封装一些业务的时候，类比函数更具有强大的封装性，所以我们需要掌握他们。

🧨 类的定义

使用class 关键字来定义一个类。如果类型没有声明，默认类型是any

class Person {
  name: string
  age: number

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

  eating() {
    console.log(this.name + " eating")
  }
}

const p = new Person("elva", 18)
console.log(p.name)
console.log(p.age)
p.eating()

🧬 类的继承

类有三大特性，分别是继承、封装、多态。使用extends关键字来实现继承，子类中使用super来访问父类

🎉 类的成员修饰符

在TypeScript中，类的属性和方法支持三种修饰符： public、private、protected

public 修饰的是在任何地方可见、公有的属性或方法，默认编写的属性就是public的，可以直接访问；

private 修饰的是仅在同一类中可见、私有的属性或方法；

protected 修饰的是仅在类自身及子类中可见、受保护的属性或方法

🎁 只读属性readonly

如果有一个属性我们不希望外界可以任意的修改，只希望确定值后直接使用，那么可以使用readonly.

只读属性是可以在构造器中赋值, 赋值之后就不可以修改
属性本身不能进行修改, 但是如果它是对象类型, 对象中的属性是可以修改

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

const p = new Person("elva", new Person("kobe"))
console.log(p.name)
console.log(p.friend)

// 不可以直接修改friend
// p.friend = new Person("james")
if (p.friend) {
  p.friend.age = 30
}