Est-il possible d'utiliser une propriété readonly dans les interfaces TypeScript ?

Question

Je voudrais définir une interface avec une propriété en lecture seule. Par exemple (comme un homme de paille) ;

interface foo {
    get bar():bool;
}

Cependant, cela donne l'erreur de syntaxe "expected ';'" sur la barre. J'ai configuré mon VisualStudio pour utiliser la cible ES5, les getters sont donc pris en charge. Comment puis-je définir une propriété en lecture seule dans une interface ?

Answer 1

Les propriétés Getter-only ont été introduites dans Typescript 2.0 :

interface foo {
    readonly bar: boolean;
}

Answer 2

Oui, il s'agit d'une limitation des interfaces. Que l'accès à la propriété soit implémenté ou non avec un getter est un détail d'implémentation et ne devrait donc pas faire partie de l'interface publique. Voir également cette question .

Si vous avez besoin d'un attribut en lecture seule spécifié dans une interface, vous pouvez ajouter une méthode getter :

interface foo {
    getAttribute() : string;
}

Answer 3

Comme l'a répondu @Vitaliy Ulantikov, vous pouvez utiliser l'option readonly sur une propriété. Cela agit exactement comme un getter.

interface Point {
    readonly x: number;
    readonly y: number;
}

Lorsqu'un objet littéral implémente l'interface, vous ne pouvez pas écraser un fichier readonly propriété :

let p1: Point = { x: 10, y: 20 };
p1.x = 5; // error!

Mais quand un classe implémente l'interface, il n'y a aucun moyen d'éviter de l'écraser.

class PointClassBroken implements Point {
    // these are required in order to implement correctly
    x: number;
    y: number;

    constructor(x: number, y: number) {
        this.x = x
        this.y = y
    }

    changeCoordinates(x: number, y: number): void {
        this.x = x // no error!
        this.y = y // no error!
    }
}

Je suppose que c'est parce que lorsque vous redéclarez des propriétés dans la définition de la classe, elles remplacent les propriétés de l'interface et ne sont plus en lecture seule.

Pour corriger cela, utilisez readonly sur les propriétés directement dans la classe qui implémente l'interface

class PointClassFixed implements Point {
    readonly x: number;
    readonly y: number;

    constructor(x: number, y: number) {
        this.x = x
        this.y = y
    }

    changeCoordinates(x: number, y: number): void {
        this.x = x // error!
        this.y = y // error!
    }
}

Voyez par vous-même dans le terrain de jeux .