Vor ein paar Jahren müssen wir, solange wir JavaScript schreiben, mehrere häufig verwendete Funktionen wie AddEventListener und AttachEvent verwenden, die nicht für fortschrittliche Technologien und Funktionen, sondern nur einige grundlegende Aufgaben vorgesehen sind, und der Grund wird durch die Unterschiede zwischen verschiedenen Browsern verursacht. Im Laufe der Zeit verbessert sich die Technologie ständig.
Entdecken Sie die Funktion, die Hochfrequenzanrufe verhindert
Diese Dbarl-Funktion ist eine wesentliche leistungssteigernde Funktion für diejenigen, die ereignisgesteuerte Aufgaben ausführen. Wenn Sie die Downscaling -Funktion bei Verwendung von Scroll, Größen-, Schlüssel- und anderen Ereignissen nicht verwenden, um Aufgaben auszulösen, machen Sie einen großen Fehler. Die folgende Down-Frequenz-Funktion des Down-Frequenz-Funktion kann Ihren Code effizient machen:
// eine Funktion zurückgeben, die, solange sie weiterhin aufgerufen wird, nicht ausgelöst wird. Die Funktion wird aufgerufen, nachdem sie nicht mehr auf // n Millisekunden aufgerufen wird. Wenn "unmittelbar" übergeben wird, auslösen Sie die Funktion auf der Vorderkante anstelle des nachfolgenden.function -Entwurfs (Func, Wait, Sofort) {var timeout; return function () {var context = this, args = argumente; var später = function () {timeout = null; if (! unmittelbar) func.apply (Kontext, args); }; var callnow = unmittelbar &&! Timeout; Clearimeout (Zeitüberschreitung); timeout = setTimeout (später, warte); if (callnow) func.apply (Kontext, args); };}; // useagevar myefficienceFn = dunounce (function () {// alle anstrengenden Sachen, die Sie tun}, 250); window.adDeVentListener ('resize', myefficienceFn);Mit der Entlargelfunktion können die von Ihnen bereitgestellte Rückruffunktion nur innerhalb eines bestimmten Zeitintervalls ausgeführt werden, wodurch die Ausführungsfrequenz verringert wird. Solche Einschränkungen sind besonders wichtig, wenn hochfrequentierte Ereignisse auftreten.
Stellen Sie die Zeit-/Frequenzzyklus -Erkennungsfunktion ein
Die oben genannte Entlassung wird durch die Hilfe eines Ereignisses ausgelöst. Aber manchmal gibt es kein solches Ereignis, sodass wir nur eine Funktion selbst schreiben können, um sie von Zeit zu Zeit zu überprüfen.
Funktionsumfrage (FN, Rückruf, Err, Timeout, Intervall) {var startTime = (neues Datum ()). GetTime (); var pi = window.setInterval(function(){ if (Math.floor(((new Date).getTime() - startTime) / 1000) <= timeout) { if (fn()) { callback(); } } else { window.clearInterval(pi); err(); } }, interval)}Einmal Funktion, die wiederholte Anrufe verbietet und nur einmal die Ausführung ermöglicht
Oft möchten wir nur, dass eine Aktion einmal ausgeführt wird, genau wie wir Onload verwenden, um zu beschränken, dass sie nur einmal ausgeführt werden, wenn die Last abgeschlossen ist. Die folgende Funktion ermöglicht es, dass Ihr Vorgang einmal ausgeführt wird und nicht wiederholt ausgeführt wird.
Funktion einmal (fn, Kontext) {var Ergebnis; return function () {if (fn) {result = fn.apply (Kontext || this, Argumente); fn = null; } Rückgabeergebnis; };} // useagevar canonlyfireonce = einmal (function () {console.log ('gefeuert!');}); CanonlyFireonce (); // "gefeuert!" CanonlyFireonce (); // nadaDiese Funktion kann sicherstellen, dass die von Ihnen bereitgestellte Funktion nur einmal ausgeführt wird und eine wiederholte Ausführung verhindern.
Holen Sie sich die absolute Adresse eines Link GetabSoluteurl
Das Erhalten der absoluten Adresse des Links ist nicht so einfach, wie Sie denken. Das Folgende ist eine sehr praktische Funktion, die die absolute Adresse basierend auf der von Ihnen eingegebenen relativen Adresse erhalten kann:
var getAbSoluteUrl = (function () {var a; return function (url) {if (! a) a = document.createelement ('a'); a.tref = url; return a.tref;};}) (); // usageGetabSoluteurl ('/etwas');Hier verwenden wir das A -Tag HREF, um eine vollständige absolute URL zu generieren, die sehr zuverlässig ist.
Bestimmen Sie, ob eine JavaScript -Funktion eine system native Funktion ist
Viele JS-Skripte von Drittanbietern werden neue Funktionen in globale Variablen einführen, und einige überschreiben sogar die nativen Funktionen des Systems. Die folgende Methode besteht darin, zu überprüfen, ob es sich um eine native Funktion handelt:
; (function () {// verwendet zur Auflösung des internen `[[class]]` von Werten var toString = Object.Prototype.toString; // verwendet zur Auflösung der dekompilierten Quelle von Funktionen Varizen var fntoString = function.Prototype.toString; +? Konstruktor/] $/; . .Replace (/toString | (Funktion). renative isnative;} ()); // usesnative (alarm);Obwohl diese Methode nicht so prägnant ist, kann sie die Aufgabe trotzdem erledigen!
Erstellen Sie neue CSS -Regeln mit JavaScript Insertrule
Manchmal verwenden wir einen CSS -Selektor (z. B. document.querySelectorAll), um einen Nodelist zu erhalten, und die Stile dann nacheinander zu jedem von ihnen ändern. Tatsächlich ist dies kein effizienter Ansatz. Es ist ein effizienter Ansatz, um eine neue CSS -Stilregel mit JavaScript zu erstellen:
// Erstellen Sie ein besseres Blattobjektblatt = (function () {// bauen stil var style = document.createelement ('style'); style.setattribute ('media', 'screen'); style.appendchild (document.createTextNode (''); document.head.appendchild (style); // bau und zurückrenden eine einzelne Funktionsrückgabe (Regel) {style.Stretule (style) {style. style.sheet.cssRules.length);Diese Praktiken sind sehr effizient. In einigen Szenarien, beispielsweise bei der Verwendung von AJAX zum Laden eines neuen HTML, müssen Sie den neu geladenen HTML -Inhalt nicht bedienen.
Stellen Sie fest, ob Webseitenelemente bestimmte Attribute und Stile MatchSelector haben
FunktionsmatentSelector (El, Selector) {var p = element.prototype; var f = p.matches || P.WebkitMatchSelektor || p.mozmatchSelektor || p.msMatchSelektor || Funktion (s) {return [] .Indexof.call (document.querySelectorall (s), this)! == -1; }; return f.call (el, selektor);} // uaGematchSelector (document.getElementById ('mydiv'), 'Div.Someselektor [SOME-ATTRIBUTE = TRUE]')Diese 7 JavaScript -Funktionen sind alles, was jeder Webprogrammierer wissen sollte, wie man sie benutzt.
Das obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, es wird für das Lernen aller hilfreich sein und ich hoffe, jeder wird Wulin.com mehr unterstützen.