Ausführliche Erklärung des klassischen JavaScript-Entwurfsmusters Strategy Pattern

Die Bedeutung des Strategiemusters besteht darin, eine Reihe von Algorithmen zu definieren, sie einzeln zu kapseln und sie austauschbar zu machen.
Ein kleines Beispiel kann es uns verdeutlichen.

Erinnern Sie sich an die Animationsmethode in jqueryDiese beiden Codezeilen bewegen p in 1000 ms linear um 200 Pixel nach rechts. ) und kubisch (kubische Lockerung) sind eine Art Kapselung des Strategiemusters

$( p ).animate( {“left: 200px”}, 1000, ‘linear’ );  //匀速运动
$( p ).animate( {“left: 200px”}, 1000, ‘cubic’ );  //三次方的缓动

Nehmen wir ein weiteres Beispiel, das ich in der ersten Jahreshälfte geschrieben habe -Zeitüberprüfungsformulare. Für jedes Mitglied gelten unterschiedliche

Überprüfungsregeln

.

Im Namensfeld müssen beispielsweise nicht leere, sensible Wörter und Zeichen überprüft werden die sind zu lang. Natürlich können Sie 3 if

else schreiben, um das Problem zu lösen, aber die Skalierbarkeit und Wartbarkeit des Schreibens von Code wie diesem kann man sich vorstellen. Wenn das Formular mehr Elemente enthält und mehr Situationen überprüft werden müssen, ist es nicht unmöglich, insgesamt Hunderte von if elses zu schreiben. Ein besserer Ansatz besteht also darin, jede Validierungsregel separat im Strategiemuster zu kapseln. Wenn Sie welche Art von Bestätigung benötigen, müssen Sie nur den Namen der Richtlinie angeben. So:

Wie Sie sehen, können die verschiedenen Validierungsregeln leicht geändert und untereinander ersetzt werden. Wenn der Produktmanager eines Tages vorschlägt, die Zeichenbeschränkung auf 60 Zeichen zu ändern. Es dauert nur 0,5 Sekunden, um die Arbeit abzuschließen.

nameInput.addValidata({
notNull: true,
dirtyWords: true,
maxLength: 30
})
而notNull，maxLength等方法只需要统一的返回true或者false，来表示是否通过了验证。
validataList = {
notNull: function( value ){
return value !== ”;
},
maxLength: function( value, maxLen ){
return value.length() > maxLen;
}
}

Verwandte Artikel:

JavaScript-Designmuster, klassisches einfaches Factory-Muster, Codebeispiel

JavaScript-Designmuster, klassisches Singleton-Muster, ausführliche Erklärung

Detaillierte Einführung in das Beobachtermuster von JavaScript-Entwurfsmustern

Das obige ist der detaillierte Inhalt vonAusführliche Erklärung des klassischen JavaScript-Entwurfsmusters Strategy Pattern. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!