TypeScript - 存取器

TypeScript 中的存取器提供了一種使用 getter 和 setter 方法訪問和設定類成員值的方式。它們控制如何訪問類成員以讀取或寫入其值。

存取器對於在 TypeScript 中實現封裝很有用，封裝限制了對類成員的訪問，僅限於類的成員函式，防止第三方未經授權的訪問。

TypeScript 支援以下方法來訪問和更改類成員

getter
setter

TypeScript 中的 Getter

Getter 用於訪問類成員的值並管理如何在類外部訪問這些值。它們可以使用 'get' 關鍵字建立。

語法

您可以按照以下語法在 TypeScript 中使用 getter。

class class_name {
    // Define private variable here.

    // Defining the getter
    get getter_name(): return_type {
        // Return variable value
    }
}

let val = class_name.getter_name;

在上述語法中，method_name 方法是一個靜態方法，可以接受多個引數並返回值。

要使用 getter 訪問值，我們可以使用類名後跟一個點，然後是 getter 方法名。

示例

在下面的示例中，我們定義了 Person 類，其中包含 'Name' 私有變數。它還包含 constructor() 方法，該方法初始化 'Name' 變數的值。

// Defining the Person class
class Person {
    // Defining the private field
    private Name: string;

    // Defining the constructor
    constructor(Name: string) {
        this.Name = Name;
    }

    // Defining the getter
    get SName(): string {
        return this.Name;
    }
}

// Creating an instance of the Person class
const person = new Person("John");
console.log(person.SName); // Outputs: John

編譯後，它將生成以下 JavaScript 程式碼。

// Defining the Person class
class Person {
    // Defining the constructor
    constructor(Name) {
        this.Name = Name;
    }
    // Defining the getter
    get SName() {
        return this.Name;
    }
}
// Creating an instance of the Person class
const person = new Person("John");
console.log(person.SName); // Outputs: John

輸出

John

示例

在下面的程式碼中，Temperature 類包含 'celsius' 私有變數。constructor() 方法初始化 'celsius' 變數的值。

// Define a class Temperature with a property Celsius of type number.
class Temperature {
    private celsius: number;

    // Define a constructor that initializes the Celsius property.
    constructor(celsius: number) {
        this.celsius = celsius;
    }

    // Define a getter fahrenheit that returns the temperature in Fahrenheit.
    get fahrenheit(): number {
        return (this.celsius * 9 / 5) + 32;
    }
}

// Create an instance of the Temperature class with a temperature of 25 degrees Celsius.
const temp = new Temperature(25);
console.log("The Fahrenheit value is: " + temp.fahrenheit); // Outputs: 77

編譯後，它將生成以下 JavaScript 程式碼。

// Define a class Temperature with a property Celsius of type number.
class Temperature {
    // Define a constructor that initializes the Celsius property.
    constructor(celsius) {
        this.celsius = celsius;
    }
    // Define a getter fahrenheit that returns the temperature in Fahrenheit.
    get fahrenheit() {
        return (this.celsius * 9 / 5) + 32;
    }
}
// Create an instance of the Temperature class with a temperature of 25 degrees Celsius.
const temp = new Temperature(25);
console.log("The Fahrenheit value is: " + temp.fahrenheit); // Outputs: 77

輸出

The Fahrenheit value is: 77

TypeScript 中的 Setter

在 TypeScript 中，setter 用於設定類成員的值，而無需在類外部訪問它們。它們使用 'set' 關鍵字來定義 setter 方法。

語法

您可以按照以下語法在 TypeScript 中使用 setter。

class class_name {
    // Define private variable here.

    // Defining the setter
    set setter_name(val: type) {
        // Set variable value
    }
}

class_name.setter_name = val;

在上述語法中，我們使用了 'set' 關鍵字後跟 'setter_name' 來定義一個 setter。它只接受一個值作為引數，並在 setter 方法內部使用它來更改任何私有類變數的值。

要使用 setter 方法，您需要使用類名後跟一個點，然後是 setter 方法名，併為其賦值。

示例

在下面的程式碼中，我們定義了 TextContainer 類，其中包含 '_content' 私有變數來儲存文字。

// Define a class with a private property and a getter/setter method
class TextContainer {
    // Define a private property
    private _content: string = '';

    // Setter method
    set content(value: string) {
        this._content = value.trim().toLowerCase();
    }

    // Getter method
    get content(): string {
        return this._content;
    }
}

// Create an instance of the class and set the content
const text = new TextContainer();
text.content = "  Hello, WORLD!  ";
console.log(text.content); // Outputs: hello, world!

編譯後，它將生成以下 JavaScript 程式碼。

// Define a class with a private property and a getter/setter method
class TextContainer {
    constructor() {
        // Define a private property
        this._content = '';
    }
    // Setter method
    set content(value) {
        this._content = value.trim().toLowerCase();
    }
    // Getter method
    get content() {
        return this._content;
    }
}
// Create an instance of the class and set the content
const text = new TextContainer();
text.content = "  Hello, WORLD!  ";
console.log(text.content); // Outputs: hello, world!

輸出

hello, world!

在 TypeScript 中使用存取器來實現封裝非常重要。您還可以在單個類中建立多個 getter 和 setter 方法。

列印頁面