typescript中的类

2020-05-12  本文已影响0人  北冥有咸鱼_

ts中如何定义类

class Person{
  name:string //属性 前面省略了public关键词
  constructor(n:string){
    this.name = n;
  }
  run():void{
    console.log(this.name)
  }
}
let p = new Person('张三');
p.run(); //张三
class Person{
  name:string //属性 前面省略了public关键词
  constructor(name:string){
    this.name = name;
  }
  getName():string{
    return this.name
  }
  setName():void{
    this.name = name
  }
}
let p = new Person('张三');
p.getName(); //张三
p.setName('李四'); 
p.getName(); //李四
ts中实现继承 extends super
class Person{
  name:string //属性 前面省略了public关键词
  constructor(name:string){
    this.name = name;
  }
  run():string{
    return `${this.name}在跑步`
  }
}
let p = new Person('赵四')
p.run(); //赵四在跑步

继承

class Web extends Person{
  constructor(name:string){
    super(name) //初始化父类的构造函数 super相当于apply
  }
  work(){
    console.log(`${this.name}在干活`)
  }
}
let w = new Web('李四')
w.run(); //李四在跑步
w.work(); //李四在干活-子类

父类和子类有同样的方法的话,首先在子类里找,找不到就去父类找

存取器

使用 getter 和 setter 可以改变属性的赋值和读取行为:

class Animal {
    constructor(name) {
        this.name = name;
    }
    get name() {
        return 'Jack';
    }
    set name(value) {
        console.log('setter: ' + value);
    }
}

let a = new Animal('Kitty'); // setter: Kitty
a.name = 'Tom'; // setter: Tom
console.log(a.name); // Jack
类里的修饰符

ts中定义属性时,提供了三种修饰符

public :公有。 在类里、子类、类外都可以访问
protected :保护类型。 在类内部、子类里可以访问。类外部不可以访问
private:私有。在类里可以访问,子类和类外都无法访问
属性如果不加修饰符,默认是public

public

class Person{
  public name:string //属性 前面省略了public关键词
  constructor(name:string){
    this.name = name;
  }
  run():string{
    return `${this.name}在跑步`
  }
  public work:string{
    return `${this.name}在工作`
  }
}
let w = new Web('李四');
w.work(); //李四在工作

protected

class Person{
  protected name:string //属性 前面省略了public关键词
  constructor(name:string){
    this.name = name;
  }
  run():string{
    return `${this.name}在跑步`
  }
}
let p = new Person('李四');
console.log(p.name) //ts报错
//只能在Person和它的子类里使用

private

class Person{
  private name:string //属性 前面省略了public关键词
  constructor(name:string){
    this.name = name;
  }
  run():string{
    return `${this.name}在跑步`
  }
}
class Web extends Person{
  constructor(name:string){
    super(name)
  }
  work(){
    console.log(this.name) // ts报错。name是私有的,只能在Person里访问。
  }
}
let p = new Person('李四');
console.log(p.name) //ts报错

静态属性 静态方法

es5中的静态方法
function Person(){
   this.run1 = function(){} //实例方法
}
Person.run2 = function(){} //静态方法
//调用实例方法
var p = new Person();
p.run1();
//调用静态方法
Person.run2();
ts中如何定义静态方法
class Person{
  public name:string
  constructor(name){
    this.name = name;
  }
  run(){
    console.log(`${this.name}在运动`)
  }
  work(){
    console.log(`${this.name}在搬砖`)
  }
  static print(){ //用static关键字声明静态方法
    console.log('print')
    //console.log(this.name) 报错 静态方法没法直接调用类里的属性
  }
} 
//调用实例方法
let p = new Person('张三')
p.work(); //张三在搬砖
//调用静态方法
Person.print();

静态方法没法直接调用类里的属性。如果想在静态方法中获取类里的属性,就把那个属性设置为静态属性

class Person{
  static name:string
  static sex = '女'
  constructor(name){
    this.name = name;
  }
  run(){
    console.log(`${this.name}在运动`)
  }
  work(){
    console.log(`${this.name}在搬砖`)
  }
  static print(){ //用static关键字声明静态方法
    console.log(Person.name) 
  }
} 
Person.sex //女
Person.print('张三'); //张三

多态

父类定义一个方法不去实现,让继承它的子类去实现,每一个子类有不同的表现

多态也是继承的一种表现,属于继承

class Animal{
  name:string
  constructor(name:string){
     this.name = name
  }
  eat(){ //具体吃什么不知道
    console.log('吃的方法')
  }
}
//具体吃什么让继承它的子类去实现,每一个子类的表现不一样,这就叫多态
//狗吃狗粮
class Dog extends Animal{
  constructor(name:string){
    super(name)
  }
  eat(){
    return this.name+'吃狗粮'
  }
}
//猫吃鱼
class Cat extends Animal{
  constructor(name:string){
    super(name)
  }
  eat(){
    return this.name+'吃鱼'
  }
}

抽象类
未完待续

上一篇 下一篇

猜你喜欢

热点阅读