## Knockout-Ansichtsmodelle: Objektliterale vs. Funktionen – Was ist besser?

Objekte vs. Funktionen zum Deklarieren von Knockout-Ansichtsmodellen

In Knockout JS können Ansichtsmodelle entweder als Objektliterale oder als Funktionen deklariert werden. Betrachten Sie die folgenden Beispiele:

// Object literal
var viewModel = {
    firstname: ko.observable("Bob")
};

ko.applyBindings(viewModel );

// Function
var viewModel = function() {
    this.firstname= ko.observable("Bob");
};

ko.applyBindings(new viewModel ());

Während beide Ansätze das gleiche Ziel erreichen, bietet die Definition von Ansichtsmodellen als Funktionen mehrere Vorteile:

Direkter Zugriff auf „dieses“

Innerhalb einer Funktion bezieht sich „this“ auf die Instanz, die erstellt wird. Dies ermöglicht einen einfachen Zugriff auf die Observablen und berechneten Eigenschaften des Ansichtsmodells:

var ViewModel = function(first, last) {
  this.first = ko.observable(first);
  this.last = ko.observable(last);
  this.full = ko.computed(function() {
     return this.first() + " " + this.last();
  }, this);
};

Im Gegensatz dazu ist bei der Verwendung von Objektliteralen eine explizite Kontextbindung innerhalb berechneter Observablen erforderlich:

var viewModel = {
   first: ko.observable("Bob"),
   last: ko.observable("Smith"),
};

viewModel.full = ko.computed(function() {
   return this.first() + " " + this.last();
}, viewModel);

Kapselung und Variablenschutz

Funktionen bieten eine natürlichere Kapselung für Ansichtsmodelle, da sie private Variablen definieren können, die nicht dem globalen Bereich ausgesetzt sind. Dies trägt dazu bei, versehentliches Überschreiben oder Konflikte zu verhindern.

var ViewModel = function() {
    var self = this;
    this.items = ko.observableArray();
    this.removeItem = function(item) {
         self.items.remove(item);
    }
};

Schließlich ermöglichen Funktionen eine einfache Bindung mithilfe der „Bind“-Methode und stellen so den richtigen Kontext für Rückruffunktionen sicher:

var ViewModel = function() {
    this.items = ko.observableArray();
    this.removeItem = function(item) {
         this.items.remove(item);
    }.bind(this);
};

Zusammenfassung Während beide Methoden zum Definieren von Knockout-Ansichtsmodellen gültig sind, bietet die Verwendung von Funktionen größere Flexibilität, Kontrolle und Kapselungsvorteile. Diese Vorteile machen Funktionen zu einer bevorzugten Wahl für komplexere und wartbarere Ansichtsmodelle.

Das obige ist der detaillierte Inhalt von## Knockout-Ansichtsmodelle: Objektliterale vs. Funktionen – Was ist besser?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!