1. Übersicht über anonyme Funktionen
Das erste Mal, dass ich etwas über anonyme Funktionen wusste, war im jQuery-Quellcode. Das erste, was ich sah, als ich jQuery öffnete, war
Kopieren Sie den Codecode wie folgt:
(function( window, undefiniert ) {.............................})(window);
Dies ist eine anonyme Funktion mit roten Parametern. Die Funktion der anonymen Funktion besteht darin, einen geschlossenen Bereich zu erstellen, und auf die darin enthaltenen Variablen und Methoden kann von außen nicht zugegriffen werden.
Wie kann jquery aufgerufen werden, da nicht darauf zugegriffen werden kann? Dies liegt daran, dass die anonyme Funktion von jquery diese beiden Sätze enthält (blauer Text):
Kopieren Sie den Codecode wie folgt:
(Funktion( Fenster, undefiniert ) {
// Definiere eine lokale Kopie von jQuery
var jQuery = function(selector, context) {
// Das jQuery-Objekt ist eigentlich nur der „erweiterte“ Init-Konstruktor
return new jQuery.fn.init( selector, context );
},
.........
window.jQuery = window.$ = jQuery;
})(Fenster);
Es stellt sich heraus, dass jQuery in der anonymen Funktion an window übergeben wird, weshalb bei der Übergabe von Parametern window übergeben wird, sodass bei jedem zukünftigen Aufruf von jquery tatsächlich das jQuery-Objekt von window aufgerufen wird.
jquery ruft seine eigenen Methoden auf. Es kann nicht von außen aufgerufen werden, was Sicherheit und Konfliktfreiheit gewährleistet.
2. Fahren Sie mit dem obigen Thema über jQuery-Plug-ins fort
Das Folgende ist Teil des Codes für die Paging-Steuerung, den ich geschrieben habe:
Kopieren Sie den Codecode wie folgt:
;(Funktion ($) {
$.fn.tabing = function (arg) {
Instanz = neues Plugin(this, arg);
};
var-Instanz = null;
Funktion Plugin(Element){
this._tabs = $(element);
this._tabli = $("a[href*='#']",this._tabs);
this._tabDiv = this._tabs.siblings().filter("div[id*='tab']");
this.init();
}
Plugin.prototype = {
init: function(){
this._tabli.addClass("unselected");
this._tabli.eq(0).addClass("selected");
this._tabDiv.css("display","none");
this._tabDiv.eq(0).css("display","block");
this._tabli.each(function(){
$(this).bind("click",function(){
for(var i = 0;i<instance._tabDiv.length;i++){
Instanz._tabDiv.eq(i).css("display","none");
}
Instanz._tabDiv.filter("#"+$(this).attr("href").split('#')[1]).css("display","block");
});
})
}
}
})(jQuery);
Achten Sie auf die roten Wörter. Tatsächlich schreiben jQuery-Plug-Ins auch anonyme Funktionen, was die Unabhängigkeit jedes Plug-Ins gewährleistet. Andernfalls wird es nicht als Plug-In bezeichnet In diesem Plug-In gibt es eine Tab-Funktion für fn von jquery.
Auf diese Weise kann das externe JQuery-Objekt direkt Tabing aufrufen, das auch den einzigen Kontakt zwischen dem Plug-In und der Außenwelt darstellt.
3. Nachdem wir über die Verwendung anonymer Funktionen durch JQuery-Plug-Ins gesprochen haben, sprechen wir über die anonymen Funktionen von Window
Tatsächlich ist jquery selbst die anonyme Funktion von Fenster, was der erste Punkt ist. Wie schreiben wir also die anonyme Funktion von Fenster?
Das heißt, nach dem Schreiben der anonymen Funktion gibt es eine Schnittstelle für die Interaktion mit dem Fenster in der Funktion, z. B. die folgende:
Kopieren Sie den Codecode wie folgt:
(Funktion(){
Funktion getObjByID(id){
return document.getElementById(id);
}
Funktion __addClass(id,className,classValue){
$(id).style.className=classValue;
}
window.addClass=__addClass;
})();
Schauen Sie sich auch die roten Wörter an, damit Sie addClass() außerhalb der anonymen Funktion aufrufen können, getObjByID() jedoch nicht.
4. Beim Parsen werden auch anonyme Funktionen ausgeführt
wie folgt:
Kopieren Sie den Codecode wie folgt:
Funktion Video() { };
function Movie() { };
var _video = neues Video();
_video.size = 3;
_video.toString = function () {
„Video“ zurückgeben;
};
_video.getName = function () {
return „VideoXXX“;
};
var _movie = new Movie();
(Funktion (Eltern, Kind) {
for (var ele im übergeordneten Element) {
if (!child[ele]) // Eine Kopie des übergeordneten Elements wird nur kopiert, wenn das untergeordnete Element das Attribut oder die Methode nicht enthält.
child[ele] = parent[ele];
}
})(_video, _movie); //So rufen Sie eine anonyme Funktion auf
alarm(_movie.size); //3
alarm(_movie.toString()); //[object Object]
alarm(_movie.getName()); //VideoXXX
Alle drei Warnungen haben Ergebnisse, die darauf hinweisen, dass die anonyme Funktion intern ausgeführt wird.