Heim > Web-Frontend > js-Tutorial > Einführung in die Idee der JS-Lazy-Funktion

Einführung in die Idee der JS-Lazy-Funktion

不言
Freigeben: 2020-02-27 14:31:42
nach vorne
2598 Leute haben es durchsucht

Lazy-Funktion ist eine weitere Anwendung der js-Funktionsprogrammierung. Dies bedeutet, dass der Zweig der Funktionsausführung nur ausgeführt wird, wenn die Funktion zum ersten Mal aufgerufen wird. In diesem Artikel wird die Idee der js-Lazy-Funktion vorgestellt an alle. Ich hoffe, dass es für alle nützlich sein wird.

Einführung in die Idee der JS-Lazy-Funktion

Bevor Vue, React und andere Frameworks weit verbreitet sind, müssen wir jQuery oder native JS verwenden, um Dom zu betreiben und Code zu schreiben Die Methode zum Anwenden von Bindungsereignissen auf DOM2-Ebene lautet: element.addEventListener(). Aus Kompatibilitätsgründen gibt es auch:

element.attachEvent(). Also müssen wir es in eine Methode kapseln:

function emit(element, type, func) {
    if (element.addEventListener) {
        element.addEventListener(type, func, false);
    } else if (element.attachEvent) {
        element.attachEvent('on' + type, func);
    } else { //如果不支持DOM2级事件
        element['on' + type] = func;
    }
}
Nach dem Login kopieren

Wenn ein Element zu diesem Zeitpunkt mehrere Klickereignisse durch ein Verhalten hinzufügen muss, wie zum Beispiel:

emit(div, 'click', fn1);
emit(div, 'click', fn2);
Nach dem Login kopieren

Binden Sie das fn1-Ereignis an das div zum ersten Mal Timing, es ist bereits bekannt, welche Bindungsmethode der Browser ausführen kann. Bei der Ausführung der Bindung von fn2 ist keine erneute Beurteilung erforderlich, dann kann der Code geändert werden:

function emit(element, type, func) {
    if (element.addEventListener) {
        emit = function (element, type, func) {
            element.addEventListener(type, func, false);
        };
    } else if (element.attachEvent) {
        emit = function (element, type, func) {
            element.attachEvent('on' + type, func);
        };
    } else {
        emit = function (element, type, func) {
            element['on' + type] = func;
        };
    }
    emit(element, type, func);
}
Nach dem Login kopieren

Mit anderen Worten: Wir machen die erste Nach der ersten Beurteilung wird die Funktion neu definiert, sodass bei der späteren Bindung keine Beurteilung erforderlich ist. Aus Sicht der Leistung ist es zwar besser, einen Abschluss zu erstellen, als in der Zukunft mehrmals dieselbe Beurteilung vorzunehmen.

Das ist die faule Idee von Funktionen Für das gleiche Urteil müssen wir es nur einmal fällen.

Dieser Artikel stammt aus der Spalte JS-Tutorial, willkommen zum Lernen!

Das obige ist der detaillierte Inhalt vonEinführung in die Idee der JS-Lazy-Funktion. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
js
Quelle:cnblogs.com
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage