So verwenden Sie js-Verschlüsse in tatsächlichen Projekten

Dieses Mal zeige ich Ihnen, wie Sie js-Verschlüsse in praktischen Projekten verwenden und welche Vorsichtsmaßnahmen für die Verwendung von js-Verschlüssen in praktischen Projekten gelten. Das Folgende ist ein praktischer Fall, schauen wir uns das an.

Ein Abschluss ist eine Sammlung einer Funktion und der Umgebung, die die darin enthaltenen Variablen offenlegt

Einfach ausgedrückt: Abschluss = Funktion + Umgebung

Das erste Beispiel für den Abschluss

function init() {
 var name = 'Mozilla'; // name is a local variable created by init
 function displayName() { // displayName() is the inner function, a closure
 alert(name); // use variable declared in the parent function 
 }
 displayName(); 
}
init();
because inner functions have access to the variables of outer functions, displayName() can access the variable name declared in the parent function, init().

Tatsächlich ist displayName() die Abschlussfunktion innerhalb von init(), und warum können extern definierte Funktionen innerhalb von displayName aufgerufen werden? Was den Variablennamen betrifft, da die interne Funktion von js die Berechtigung hat, die Variablen in der externen Funktion abzurufen.

Zweites Beispiel

var data = [
 {'key':0},
 {'key':1},
 {'key':2}
];
function showKey() {
 for(var i=0;i<data.length;i++) {
   setTimeout(function(){
    //console.log(i); //发现i输出了3次3
   //console.log(this); // 发现 this 指向的是 Window
   data[i].key = data[i].key + 10;
   console.log(data[i].key)
   }, 1000);
 }
}
showKey();

Kann das obige Beispiel 10 11 12 korrekt ausgeben?

Die Antwort lautet: Nein, und es wird ein Syntaxfehler gemeldet....

console.log(i); habe festgestellt, dass ich 3 dreimal ausgegeben habe, das heißt Sagen wir, nach 1000 Millisekunden ist die for-Schleife beendet, wenn die Abschlussfunktion ausgeführt wird. i ist ein fester Wert, der nicht den erwarteten Effekt erzielt.

console.log(this); stellte fest, dass dies auf Window verweist, das heißt, die in der Funktion implementierte Abschlussfunktion wurde in eine globale Funktion konvertiert und im Speicher gespeichert.

Sie müssen also eine andere Ausführungsfunktion definieren

var data = [
 {'key':0},
 {'key':1},
 {'key':2}
];
function showKey() {
 var f1 = function(n){
  data[i].key = data[i].key + 10;
  console.log(data[i].key)
 }
 for(var i=0;i<data.length;i++) {
   setTimeout(f1(i), 1000);
 }
}
showKey();
// 得到预期的 10 11 12

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln zum Thema PHP chinesische Website!

Empfohlene Lektüre:

So verwenden Sie den Website-Generator VuePress

VuePress generiert eine Website

Das obige ist der detaillierte Inhalt vonSo verwenden Sie js-Verschlüsse in tatsächlichen Projekten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!