学习TS(4)类

143 阅读2分钟

「这是我参与2022首次更文挑战的第33天,活动详情查看:2022首次更文挑战」。

TS 中定义类

class Pointer{
    x!:number; // 实例上的属性必须先声明
    y!:number;
    constructor(x:number,y?:number,...args:number[]){
        this.x = x;
        this.y = y as number;
    }
}
let p = new Pointer(100,200);

// 实例上的属性需要先声明在使用,构造函数中的参数可以使用可选参数和剩余参数

类中的修饰符

  • public 修饰符(谁都可以访问到)
class A{
    public name!:string;
    // 不写 public 默认也是公开的
    public age!:number;
    constructor(name:string,age:number){
        this.name = name;
        this.age = age;
    }
}


class B extends A{
    constructor(name:string,age:number){
        super(name,age);
        console.log(this.name,this.age);
    }
}
let p = new B("dafei",18);
console.log(p.name,p.age);


  • 通过参数属性来简化父类中的代码
class A{
    // public name!:string;
    // 不写 public 默认也是公开的
    // public age!:number;
    // 简写
    constructor(public name:string, public age:number){
        this.name = name;
        this.age = age;
    }
}


class B extends A{
    constructor(name:string,age:number){
        super(name,age);
        console.log(this.name,this.age);
    }
}
let p = new B("dafei",18);
console.log(p.name,p.age);
  • protected 修饰符(自己和子类可以访问到)

class A{
    // 简写
    constructor(protected name:string, protected age:number){
        this.name = name;
        this.age = age;
    }
}


class B extends A{
    constructor(name:string,age:number){
        super(name,age);
        console.log(this.name,this.age);
    }
}
let p = new B("dafei",18);
console.log(p.name,p.age); // 无法访问

  • readonly 修饰符(只读修饰符)

class A{
    // 简写
    constructor(readonly name:string, readonly age:number){
        this.name = name;
        this.age = age;
    }
    changName(name:string){
        this.name = name; // 只读属性只能在 constructor 中被赋值
    }
}


class B extends A{
    constructor(name:string,age:number){
        super(name,age);
    }
}
let p = new B("dafei",18);
console.log(p.name,p.age);
p.changName('大飞')

静态属性和方法

class A{
    static type = '灵长类'; // 静态属性
    static getName(name:string){
        return '人猿类'
    }
    
    private _name:string = "dafei";
    
    get name(){
        // 属性访问器
        return this._name;
    }
    set name(name:string){
        this._name = name;
    }
}
// 静态属性与静态方法是可以被子类所继承的

let a = new A();
console.log(a.name);


Super 属性


class A{
    
    say(message:string){
        console.log(message);
    }
    
    static getType(){
        return '动物'
    }
}


class B extends A{
    say(){
    // 原型方法中的 super 代指的是父类的原型
        super.say('喵喵喵')
    }
    static getType(){
        // 静态方法中的 super 代指的是父类
        return super.getType()
    }
}
let p = new B();
console.log(B.getType());