Typescript基础(3)——类

前言

今天继续typescript的学习，开始ts类的学习。

类

类的实现

在es6中新增了类的概念。我们先看es6中类的实现。

class person {
  constructor(name,age){
    this.name = name;
    this.age = age;
  }
  getname(){
    return this.name;
  }
}
let p1 = new person('小张',24)
console.log(p1.getname())

在ts中类的定义。ts中类的定义跟es6差别不大。只是ts中新增了对属性的类型的校验。因此我们在使用属性之前必须先定义属性的类型。比如下面person类中的name和age属性。在constructor和getname中使用之前必须先指定其类型。

class person {
  // 指定参数类型
  name:string;
  age:number;
  constructor(name:string,age:number){
    this.name = name;
    this.age = age;
  }

  getname():string{
    return this.name;
  }

}

let p1 = new person('小红',24)
console.log(p1.getname())

类的继承

es6中的继承:在es6中通过extends和super来实现继承。

// es6中的继承
class student extends person{
  constructor(name,age,sex){
    super(name,age);
    this.sex = sex;
  }
  getsex(){
    return this.sex
  }
}

let s = new student('小李',25,'男')
console.log(s.getname())
console.log(s.getsex())

ts中类的继承和es6中非常相似。

class person {
  // 指定参数类型
  name:string;
  age:number;
  constructor(name:string,age:number){
    this.name = name;
    this.age = age;
  }

  getname():string{
    return this.name;
  }

}

let p1 = new person('小红',24)
console.log(p1.getname())

// 类的继承
class student extends person{
  sex:string;
  constructor(name:string,age:number,sex:string){
    super(name,age);
    this.sex = sex;
  }
  getsex():string{
    return this.sex
  }
}

修饰符

在ts中定义属性的时候，提供了三种修饰符。分别是public,protected和private。这三种修饰符用来表示属性能够被访问的范围。

public    表示公有的 可以在类中，类外面，子类中被访问。

protected  表示被保护的类型 可以在类中和子类中被访问。不能在类外面被访问。

private 表示私有类型 可以在类中访问。在子类和类外部都无法访问。

1.public、protected和private修饰符定义的属性在类内部都可以被访问。

class human {
  // 指定参数类型
 public name:string;
 protected age:number;
 private salary:string;
  constructor(name:string,age:number,salary:string){
    this.name = name;
    this.age = age;
    this.salary = salary;
  }
  getname():string{
    return this.name;
  }
  getage():number{
    return this.age;
  }
  getsalary():string{
    return this.salary;
  }
}

2.public修饰符定义的属性在类外部可以被访问。protected和private修饰符定义的属性在类外部无法被访问。
当我们在外部访问privagte定义的属性时，会出现报错。
这里的salary是private修饰的属性，无法进行设置。

let h2 = new person('小红',24,10000) // expected 2 arguments, but got 3.
console.log(h1.getage()); // 报错 protected修饰的age属性无法在外部被访问。

3.public和protected修饰符定义的属性可以在子类中被访问。但是private修饰符定义的属性无法在子类中访问。
比如，当子类继承父类。调用super()方法时，如果传入了父类中私有的属性那么会报错。如果在子类方法中想要获取父类
私有属性也会报错。

class people extends person{
  constructor(name:string,age:number,sex:string){
    super(name,age,sex);  // 报错
  }
  getsex():string{
    return this.sex;  // 报错
  }
}

readonly修饰符
在ts中还提供了readonly修饰符来将属性设置为只读。只读属性必须在生明时或者构造函数中被初始化。

class teacher {
  readonly name:string;
  constructor(name:string){
    this.name = name;
  }
  getname():string{
    return this.name
  }
}

let t = new teacher('张三')
console.log(t.name);
console.log(t.getname());
t.name = '李四'  // 修改readonly 修饰的属性时报错。

静态方法

在es6中，所有在类中定义的方法，都会被实例继承。如果在一个方法前，加上static关键字，就表示该方法不会被实例继承，而是直接通过类来调用，这就称为“静态方法”。

class foo{
  constructor(name,age){
    this.name = name;
    this.age = age;
  }
  getname(){
    return this.name;
  }
  static getage(){
    return this.age;
  }
}

let f  = new foo('刘亦菲',24);
console.log(f.getname())  // 刘亦菲
console.log(foo.getage()) // undefined 这里的this指的是类foo
console.log(f.getage()) // 静态方法无法被实例调用

ts中静态方法的使用:通过使用static关键字定义静态属性和静态方法。
静态属性和静态方法只能通过类名来进行访问。实例和this都无法进行访问。

// 静态方法
class foo{
  // 静态属性
  static obj = {
    name:'刘亦菲',
    age:30
  }
  public name:string
  constructor(name:string){
    this.name = name;
  }
  // 静态方法
  static getage(){
    // 调用静态属性时需要使用类来调用。
    return foo.obj.age
  }
  getname(){
    return this.name
  }
}

let f = new foo('晓明')
console.log(foo.getage())  // 调用静态方法
console.log(f.getname())  // 调用实例方法

抽象类

抽象类是作为其他继承类的基类使用。他们一般不会被实例化。在ts中用abstract定义抽象类和抽象方法。

abstract class animal{
  abstract eat():any;
}

1.抽象类无法被实例化

abstract class animal{
  abstract eat():any;
}
let a = new animal() // 报错cannot create an instance of an abstract class

2.抽象类中的抽象方法，不包含具体实现。只定义方法签名，不定义方法体。

abstract class animal{
  abstract eat():any; // 只有方法名，没有方法体
  abstract play:any{} // 报错  抽象方法不能有实现，也就是说不能有方法体。
}

3.抽象类的子类必须实现抽象类中的抽象方法。

// 抽象类
abstract class animal{
  protected food:string;
  protected ball:string;
  constructor(food:string,ball:string){
    this.food = food;
    this.ball = ball;
  }
  abstract eat():any;
  abstract play():any;
}

// 子类
class dog extends animal{
  constructor(food:string,ball:string){
    super(food,ball)
  }
  // 必须实现抽象类中的抽象方法
  eat(){
    console.log(`小狗在吃${this.food}`)
  }
  play(){
    console.log(`小狗在玩${this.ball}`)
  }
}

let dog = new dog('骨头','篮球')
dog.eat()
dog.play()