Heim >Web-Frontend >js-Tutorial >Warum geben alle meine Click-Handler „Link 5' zurück?

Warum geben alle meine Click-Handler „Link 5' zurück?

DDD
DDDOriginal
2024-12-27 10:47:13194Durchsuche

Why Do All My Click Handlers Return

Berüchtigtes Javascript-Loop-Problem: Schließung enthüllt die Magie

Das berüchtigte Schleifenproblem tritt auf, wenn das Code-Snippet versucht, eine Sammlung von Links mit zu erstellen einzigartige Klick-Handler. Dennoch wird jeder Klick als „Link 5“ registriert, was einen Zauber der Verwirrung auslöst.

Abschluss: Der rätselhafte Zauberer

Das Rätsel liegt im Umfang von JavaScript, einem gebundenen Reich nach Funktionen, nicht nach Blöcken. Abschlüsse, verschleierte Zauberer, halten den umschließenden Bereich in ihrem Griff.

Die fehlerhafte Schleife

In der fehlerhaften Schleife ist die Variable „i“ auf die Funktion beschränkt, eingesperrt in einem Gefängnis der Schließung. Wenn sich die Schleife schließt, verwandelt sich „i“ in „5“ und hinterlässt seinen gespenstischen Abdruck bei den unglücklichen Handlern.

Die Erlöserschleife

Ein Hoffnungsschimmer entsteht daraus die zweite Schleife. Jede Iteration zaubert ein unabhängiges Funktionsobjekt, von dem jedes seine eigene Wächternummer bewacht. Diese Prägung widersteht dem mutagenen Einfluss der Zeit und schützt die Handler vor dem heimtückischen Zauber der „5“.

Eine optimierte Dreifaltigkeit

Während der Abschluss diese wundersame Transformation vorantreibt, ist er verlangt einen extravaganten Preis – zwei frische Funktionsobjekte pro Link. Eine elegantere Lösung ergibt sich aus der Nutzung des geheimen Wissens des DOM. Indem wir Daten direkt auf den Knoten speichern, zaubern wir Verbindungen mit eindeutigen Erinnerungen herauf, befreit von der Tyrannei des äußeren Bereichs.

Das arkane Elixier

Der wahre Zauber liegt darin dieser Teil des Codes:

function linkListener() {
    alert(this.i);
}

function addLinks() {
    for(var i = 0; i < 5; ++i) {
        var link = document.createElement('a');
        link.appendChild(document.createTextNode('Link ' + i));
        link.i = i;
        link.onclick = linkListener;
        document.body.appendChild(link);
    }
}

Jeder Link trägt sein eigenes „i“, das seine einzigartige Identität flüstert in den Reiz eines Klicks. Die Magie des Verschlusses, jetzt mit Präzision eingesetzt, wirkt einen Wunderzauber und befähigt Links, sich an ihr eigenes Schicksal zu erinnern.

Das obige ist der detaillierte Inhalt vonWarum geben alle meine Click-Handler „Link 5' zurück?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
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