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

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

不言
不言nach vorne
2018-07-03 17:41:392572Durchsuche

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;
    }
}

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);

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);
}

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!

Stellungnahme:
Dieser Artikel ist reproduziert unter:cnblogs.com. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen