Eine kurze Analyse des Anti-Konflikt-Mechanismus in jQuery-noConflict

Quelle: Taobao UED

Viele JS-FrameworksKlassenbibliotheken verwenden das $-Symbol als Funktion oder Variablennamen , jQuery ist das typischste. In jQuery ist das $-Symbol nur eine Referenz des window.jQuery-Objekts. Selbst wenn $ gelöscht wird, ist window.jQuery immer noch ein starker Rückhalt, um die Integrität der gesamten Klassenbibliothek sicherzustellen. Das API-Design von jQuery berücksichtigt vollständig Referenzkonflikte zwischen mehreren Frameworks. Wir können die Methode jQuery.noConflict verwenden, um die Kontrolle einfach zu übertragen.

Die jQuery.noConflict-Methode enthält einen optionalen booleschen Parameter ^[1], der bestimmt, ob die $-Referenz übergeben werden soll, während das jQuery-Objekt selbst übergeben wird:

JavaScript

1	jQuery.noConflict([removeAll])

1

jQuery .noConflict([removeAll])

Standardmäßig wird beim Ausführen von noConflict die Kontrolle über die Variable $ an die erste Bibliothek übertragen, die $ generiert. Wenn „removeAll“ auf „true“ gesetzt ist, wird beim Ausführen von noConflict die Kontrolle über $ und das jQuery-Objekt selbst übergeben die erste Bibliothek, die sie generiert hat.

Wenn beispielsweise KISSY und jQuery gemischt werden und $ = KISSY zur Vereinfachung von API-Operationen verwendet wird, kann diese Methode zur Lösung des Namenskonfliktproblems verwendet werden.

Wie wird dieser Mechanismus implementiert? Lesen Sie den jQuery-Quellcode am Anfang ^[2]. Das erste, was Sie tun müssen, ist Folgendes:

JavaScript

1 2 3 4 5

// Map over jQuery in case of overwrite         _jQuery = window.jQuery,           // Map over the $ in case of overwrite         _$ = window.$,

1

2

3

4

5

  // Map über jQuery im Falle eines Überschreibens

     _jQuery = window.jQuery,

 // Im Falle eines Überschreibens über das $ abbilden

 _$ = window .$,

Es ist leicht zu verstehen, dass jQuery die beiden Objekte jQuery und $ in der Fensterumgebung über zwei private Variablen zuordnet, um zu verhindern, dass die Variablen gewaltsam überschrieben werden. Sobald die noConflict-Methode aufgerufen wird, wird der Unterschied zwischen _jQuery, _$, jQuery, $ verwendet, um die Übertragungsmethode der Steuerung zu bestimmen. Der spezifische Code lautet wie folgt:

JavaScript

1

2

3

4

5

6

7

8

9

10

11

noConflict: Funktion( tief ) {

if ( Fenster.$ === jQuery ) {

 Fenster.$ = _$;

 }

                >&& Fenster.jQuery === jQuery ) {                        window.jQuery =

_jQuery; } return

jQuery

;

        }

Schauen wir uns das oben erwähnte Problem mit der Parametereinstellung an. Wenn „deep“ nicht festgelegt ist, deckt _$ window.$ ab. Zu diesem Zeitpunkt wird der jQuery-Alias ​​​​$ ungültig, aber jQuery selbst ist intakt. Wenn eine andere Bibliothek oder ein anderer Code die $-Variable neu definiert, wird die Kontrolle darüber vollständig übertragen. Wenn andererseits „deep“ auf „true“ gesetzt ist, überschreibt _jQuery window.jQuery und sowohl $ als auch jQuery sind ungültig.

Der Vorteil dieser Operation besteht darin, dass es sich aufgrund des von der noConflict-Methode bereitgestellten Übergabemechanismus und der Tatsache, dass sie eine zurückgibt, unabhängig davon, ob es sich um eine stark widersprüchliche Ausführungsumgebung wie das Mischen von Frameworks oder die Koexistenz mehrerer jQuery-Versionen handelt Bei einem nicht begrenzten jQuery-Objekt ist es durchaus möglich, Konflikte durch Variablenzuordnung zu lösen.

Aber die unvermeidliche Tatsache ist, dass es zu Problemen wie Plug-In-Fehlern kommen kann. Natürlich kann es durch einfaches Ändern der Kontextparameter wiederhergestellt werden

JavaScript

1

2

1 2 3 4 5 6

var query = jQuery.noConflict(true); (function ($) {        // 插件或其他形式的代码，也可以将参数设为 jQuery   })(query);

3

4

5

6

var Abfrage = jQuery.noConflict(true );

( Funktion ($) {

// Plug-Ins oder andere Codeformen können auch Parameter für jQuery festlegen

})(Abfrage);

[1] http://api.jquery.com/jQuery.noConflict/#jQuery-noConflict-removeAll[2] https://github.com/jquery/jquery/blob/master/src/core.js

Das obige ist der detaillierte Inhalt vonEine kurze Analyse des Anti-Konflikt-Mechanismus in jQuery-noConflict. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!