TypeScript快速入门 - 类的使用

TypeScript 类

1、类的声明

        关键字:class

class Child {

}

2、类的继承

        关键字:extends

class Father{ 

}

class Child extends Father {

}

3、类与接口

        关键字:implments

interface IMan {
    name: string
}

class Father implements IMan {
    name: string

    constructor(name: string) {
    this.name = name;
    }
}

class Child extends Father {

}

let child = new Child("张三");

console.log(child.name);

// 张三

4、抽象类

        关键字:abstract

interface IMan {
  name: string
}

abstract class Man {
  say(): string {
    return "我是抽象类!"
  }
}

class Father extends Man implements IMan {
  name: string

  constructor(name: string) {
    super()
    this.name = name;
  }
}

class Child extends Father {

}

let child = new Child("张三");


console.log(child.name);
console.log(child.say());

// 张三
// 我是抽象类!

5、类的成员变量修饰符

        公开的:public

        私有的:private

        受保护的:protected

        只读的:readonly

class Man {
  // 受保护
  protected gender: string
  // 只读
  readonly age: number = 18

  constructor(gender: string) {
    this.gender = gender;
  }
}

class Teacher extends Man {
  // 公开
  public name: string
  // 私有
  private DNA: string = "aaa"

  getGender(): string {
    return this.gender;
  }
  setGender(gender: string) {
    this.gender = gender;
  }

  constructor(name: string) {
    super("男");
    this.name = name;

    // 可以访问 private属性只能在本类中访问
    console.log(this.DNA); // aaa 

    // 可以访问 protected属性只能在本类及其子类中访问
    console.log(this.gender); // 男
  }
}

let teacher = new Teacher("张老师");
// 因为修饰符是public 可以修改和访问
teacher.name = "王老师"
console.log(teacher.name);  // 王老师

// 报错 因为修饰符是private 所以无法访问
// 属性“DNA”为私有属性,只能在类“Teacher”中访问。
console.log(teacher.DNA);

// 报错 因为修饰符是protected
// 属性“gender”受保护,只能在类“Man”及其子类中访问。
console.log(teacher.gender);
// 可以在Man的子类Teacher中进行访问或修改
console.log(teacher.getGender()); // 男
teacher.setGender("女");
console.log(teacher.getGender()); // 女

// 报错 只读属性不能修改
// 无法为“age”赋值,因为它是只读属性。
teacher.age = 20;
console.log(teacher.age); // 18

你可能感兴趣的:(typescript,react,native,javascript,前端)