天天看點

TypeScript中的類--(TypeScript 05)

這是我參與8月更文挑戰的第10天,活動詳情檢視: 8月更文挑戰

類的注解方式

  1. 需要對執行個體的屬性進行注解。
  2. 類的方法中有參數的需要進行注解。
class Greeter {
    greeting: string;
    constructor(message: string) {
        this.greeting = message;
    }
    greet() {
        return "Hello, " + this.greeting;
    }
}
let greeter = new Greeter("world");
複制代碼      

繼承中的super

1. 構造函數内部的super指的是父類的構造函數

TypeScript中的類--(TypeScript 05)
class Animal {
    name: string;
    constructor(theName: string) { this.name = theName; }
    move(distanceInMeters: number = 0) {
        console.log(`${this.name} moved ${distanceInMeters}m.`);
    }
}
class Snake extends Animal {
    constructor(name: string) { super(name); }
    move(distanceInMeters = 5) {
        console.log("Slithering...");
        super.move(distanceInMeters);
    }
}
let sam = new Snake("Sammy the Python");
sam.move();
複制代碼      

類成員的修飾符

1. public:公共的成員屬性

  • 自身可以調用
  • 執行個體可以調用
  • 子類可以調用
class Animal {
    public name: string;
    public constructor(theName: string) { this.name = theName; }
    public move(distanceInMeters: number) {
        console.log(`${this.name} moved ${distanceInMeters}m.`);
    }
}
複制代碼      

2. private : 隻有自身可以調用

class Animal {
    private name: string;
    constructor(theName: string) { this.name = theName; }
}
new Animal("Cat").name; // 錯誤: 'name' 是私有的.
複制代碼      

3. 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); // 錯誤
複制代碼      

readonly修飾符

readobly關鍵字将屬性設定為隻讀,這個屬性必須在聲明或者構造函數中被初始化。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"; // 錯誤! name 是隻讀的.
複制代碼      

參數屬性

參數屬性本質上就是一種簡寫的首發,就是将聲明和指派合并在一處。下面兩種方式其實是等價的。
// 方式1
class Octopus {
    readonly numberOfLegs: number = 8;
    constructor(readonly name: string) {
    }
}
// 方式2
class test {
    readonly numerOfLegs: number = 8;
    readonly name: string;
    constructor(Thename: string) {
        this.name = Thename;
    }
}      

繼續閱讀