ts-class

作者: 恒星的背影 | 来源:发表于2020-01-11 16:45 被阅读0次

构造函数

构造函数出现的原因:更加方便地写出生成对象的函数。

简单例子

class Animal {
    name: string;
    constructor(theName: string) { 
      this.name = theName; 
    }
    move(distanceInMeters: number = 0) {
        console.log(`${this.name} moved ${distanceInMeters}m.`);
    }
}

class Horse extends Animal {
    constructor(name: string) { 
      super(name); 
    }
    move(distanceInMeters = 45) {
        console.log("Galloping...");
        super.move(distanceInMeters);
    }
}

let tom: Animal = new Horse("Tommy the Palomino");

tom.move(34);

public, private, protected

默认情况下属性是 public 的,private 修饰的属性只能在 class 内使用。

class Animal {
    private name: string;
    constructor(theName: string) { this.name = theName; }
}

new Animal("Cat").name; // Error: 'name' is private;

关于类型之间是否兼容的例子:

class Animal {
    private name: string;
    constructor(theName: string) { this.name = theName; }
}

class Rhino extends Animal {
    constructor() { super("Rhino"); }
}

class Employee {
    private name: string;
    constructor(theName: string) { this.name = theName; }
}

let animal = new Animal("Goat");
let rhino = new Rhino();
let employee = new Employee("Bob");

animal = rhino;
animal = employee; // Error: 'Animal' and 'Employee' are not compatible

protected 可以在子类中使用。

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

class Employee extends Person {
    private department: string;

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

    public getElevatorPitch() {
        return `Hello, my name is ${this.name} and I work in ${this.department}.`;
    }
}

let howard = new Employee("Howard", "Sales");
console.log(howard.getElevatorPitch());
console.log(howard.name); // error

readonly

只读属性只能在声明时或构造函数中初始化。

class Octopus {
    readonly name: string;
    readonly numberOfLegs: number = 8;
    constructor (theName: string) {
        this.name = theName;
    }
}

let dad = new Octopus("Man with the 8 strong legs");
dad.name = "Man with the 3-piece suit";   // error! name is readonly.

readonly 可以和 public, protected, private 同时使用。

Accessor

Accessor 指用了 get 或 set 修饰的属性。
get 和 set 用来控制对属性的读取和修改。

const fullNameMaxLength = 10;

class Employee {
    private _fullName: string;

    get fullName(): string {
        return this._fullName;
    }

    set fullName(newName: string) {
        if (newName && newName.length > fullNameMaxLength) {
            throw new Error("fullName has a max length of " + fullNameMaxLength);
        }
        
        this._fullName = newName;
    }
}

let employee = new Employee();
employee.fullName = "Bob Smith";
if (employee.fullName) {
    console.log(employee.fullName);
}

static 属性

直接挂在类上的属性,不存在于实例身上。

class Grid {
    static origin = {x: 0, y: 0};
    calculateDistanceFromOrigin(point: {x: number; y: number;}) {
        let xDist = (point.x - Grid.origin.x);
        let yDist = (point.y - Grid.origin.y);
        return Math.sqrt(xDist * xDist + yDist * yDist) / this.scale;
    }
    constructor (public scale: number) { }
}

let grid1 = new Grid(1.0);  // 1x scale
let grid2 = new Grid(5.0);  // 5x scale

console.log(grid1.calculateDistanceFromOrigin({x: 10, y: 10}));
console.log(grid2.calculateDistanceFromOrigin({x: 10, y: 10}));

abstract class

to do

高级技巧

to do

小结

继承的写法和ES6一样。
扩展了 public, private, protected, readonly 等修饰词。
扩展了 static 属性。

相关文章

  • ts-class

    构造函数 构造函数出现的原因:更加方便地写出生成对象的函数。 简单例子 public, private, prot...

网友评论

      本文标题:ts-class

      本文链接:https://www.haomeiwen.com/subject/rmufactx.html