javascript - Getter/Setter in Typescript ohne Klasse

Hier ist eine Auswahl an SO-Fragen zu Typescript-Getter/Setter: von 2015, Januar 2018, September 2018, unter anderem.

Abgesehen davon, was ist die empfohlene Methode, um Typescript-Typen für Getter/Setter in einem normalen JS-Objekt zu definieren? Das heißt, ich möchte ein ganz normales JavaScript-Objekt ohne die class-Syntax und die Best Practices für das Typing verstehen. Hier ist das Interface -

interface Store {
   activeEvent: Date
}

Einige Einschränkungen für dieses Objekt -

Kein new zum Instanziieren

Keine Duplikate - das funktioniert nicht

const Store: Store = {
  activeEvent: new Date(),
  get activeEvent() {
    return this.activeEvent;
  },
}

Keine hängenden Unterstriche. Die eslint-Konfiguration von Airbnb meckert darüber -

const Store: Store = {
  _activeEvent: {},
  get activeEvent() {
    return this._activeEvent;
  },

Idealerweise möchte ich Standardwerte haben (das heißt, wenn ich den Schlüssel weglasse, verschwindet der Fehler, aber beim ersten Zugriff ist activeEvent undefiniert). Ich nehme an, ich könnte this.activeDate initialisieren und zurückgeben, wenn es undefiniert ist, was funktioniert, aber get ist in diesem Szenario tatsächlich get & set.

 get activeDate() {
    if(this.activeDate){ return this.activeDate }
    const date = new Date()
    this.activeDate = date;
    return date;
  },

Ich würde lieber keine doppelten Schlüssel mit Gettern und Settern erzeugen, nur um Getter und Setter zu haben.

Interessanterweise führt die Tatsache, dass der Getter/Setter denselben Schlüssel haben, nicht zu einem Fehler, es ist nur dann problematisch, wenn sie mit der eher privaten Variable übereinstimmen, was mich denken lässt, dass ich etwas falsch mache. Ich schätze jede Einsicht.

Antwort #1

Wickeln Sie Ihre Objekterstellung in eine Closure und halten Sie Variablen, die nicht Teil der Schnittstelle sind, außerhalb des Objekts:

function createStore() {
  let activeEvent = new Date();
  return {
    get activeEvent() {
      return activeEvent;
    },
  };
}

Dies vermeidet das Problem der Namenskollision/unendlichen Schleife, auf das Sie derzeit stoßen - das von Ihnen zurückgegebene Objekt hat einen .activeEvent-Getter, aber die Variable, die diesen unterstützt, lebt außerhalb des Objekts, im Umfang der Funktion createStore.