当前位置:   article > 正文

TS class类的定义、extends类的继承、属性修饰符、implements类的接口实现、abstract抽象类_ts implements

ts implements

TS class类的定义、extends类的继承、属性修饰符、implements类的接口实现、abstract抽象类

1. class类定义
class Person {
  // 与 js 不同,这里必须要声明所需变量,否则 constructor 中 this 无法访问到属性
  name:string
  age:number
  address:string
  
  constructor(name:string,age:number,address:string) {
    this.name = name
    this.age = age
    this.address = address
  }
}

let p1 = new Person("ccc", 22, "china")
console.log(p1)  // Person { name: 'ccc', age: 22, address: 'china' }
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
2. extends类继承
class Person {
  name:string
  age:number
  address:string
  constructor(name:string,age:number,address:string) {
    this.name = name
    this.age = age
    this.address = address
  }
}

// 使用 extends 继承 Person 类
class Man extends Person {
  sex:number
  constructor(name:string,age:number,address:string, sex:number) {
    super(name, age, address)
    this.sex = sex
  }
}

let p1 = new Man("ccc", 22, "china", 1)
console.log(p1)  // Man { name: 'ccc', age: 22, address: 'china', sex: 1 }
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
3. 属性修饰符(static、public、protected、private)
class Person {
  static s = "static"
  name1:string
  protected age:number
  private address:string
  constructor(name1:string,age:number,address:string) {
    this.name1 = name1
    this.age = age
    this.address = address
  }
  static fun() {
    // static 修饰的方法无法访问其他修饰符修饰的变量
    this.name1  // 报错
    this.s  // 可以访问
  }
}

class Man extends Person {
  sex:number
  constructor(name:string,age:number,address:string, sex:number) {
    super(name, age, address)
    this.sex = sex
    this.address  // 报错:address 为 private 私有变量
  }
}

let p1 = new Man("ccc", 22, "china", 1)

p1.s // 报错:static 修饰的变量无法在实例上访问
Person.s // 可以访问
p1.name1 // 可以访问
p1.age // 报错:protected 修饰的变量无法在实例上访问
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
4. implements类的接口实现
interface F {
  // 接口中只能包含抽象方法,不能有具体实现
  cName: () => void
}

class Person implements F {
  name: string
  age: number
  address: string

  constructor(name: string, age: number, address: string) {
    this.name = name
    this.age = age
    this.address = address
  }
  // 需要对 interface F 中有具体的方法实现
  cName():void {
    console.log(this.name);
  }
}

let p1 = new Person("ccc", 22, "china")
p1.cName()  // ccc
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
5. abstract抽象类
abstract class Person {
  name1:string
  constructor(name1:string) {
    this.name1 = name1
  }
  // 抽象方法只能在抽象类中定义
  abstract cName():void
}

let p1 = new Person("chenxize") // 报错:无法创建抽象类的实例

class Man extends Person {
  age:number
  constructor(name:string, age:number) {
    super(name)
    this.age = age
  }
  // 需要对抽象类中的抽象方法有具体实现
  cName():void {
    console.log(this.name1);
  }
}

let m1 = new Man("chenxize", 22)
console.log(m1);  // Man { name1: 'chenxize', age: 22 }

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/2023面试高手/article/detail/78725
推荐阅读
相关标签
  

闽ICP备14008679号