Detaillierte Erläuterung des Anwendungscodes des js-Abschlusses und des Prototyps

1. Abschlüsse

Ein Abschluss in js ist eine Funktion (eine geschlossene Paketstruktur oder ein Raum, der zur Außenwelt nicht offen ist)

1. Durch Schließungen zu lösende Probleme

• Auf Daten innerhalb der Funktion kann außerhalb der Funktion nicht zugegriffen werden

• Zu sein Gelöst Das Problem besteht darin, dass auf die Daten innerhalb der Funktion indirekt von außen zugegriffen werden muss

2. Grundstruktur

function outer(){ var data = "数据"; return function(){ return data; } }

function outer(){ var data = "数据"; return { getData:function(){ return data; }, setData:function(value){ data = value; return data; } } }

3 >1) Verwenden Sie Closure, um das Timer-Problem zu lösen

由于js是单线程执行的，会先执行主任务，然后执行次要任务(包括setTimeOut和setInterval中的回调函数中的代码)

Zum Beispiel:

for(var i = 0 ; i < 10; i++){ setTimeout(function(){ console.log(i); },0); }

gibt nicht wie erwartet 1~10 aus, sondern 10 10, da die for-Schleife dies nicht tut wird ausgeführt, bis sie ausgeführt wird. setTimeout-Rückruffunktion, wenn die Zeit abgelaufen ist, ausführen

Lösung:

for(var i = 0; i< 3; i++){ function foo(j){ return function(){ console.log(j); }; } var f = foo(i); setTimeout(f, 0); }

Dies gibt 1 2 3 aus

2) Verwenden Sie den Abschluss zum Speichern die Umgebung

Verschlüsse haben die gleiche Funktionsdefinition, speichern aber unterschiedliche lexikalische Umgebungen

function makeSizer(size) { return function() { document.body.style.fontSize = size + 'px'; }; }var size12 = makeSizer(12);var size14 = makeSizer(14);var size16 = makeSizer(16); document.getElementById('size-12').onclick = size12; document.getElementById('size-14').onclick = size14; document.getElementById('size-16').onclick = size16;

Der Text ändert sich, wenn auf 12, 14, 16 geklickt wird

function makeSizer(size) { document.body.style.fontSize = size + 'px'; }

3) Erstellen Verwenden Sie Abschlüsse beim Erstellen von Objekten oder Klassen

Zum Beispiel können wir so schreiben:

function MyObject(name, message) { this.name = name.toString(); this.message = message.toString(); } MyObject.prototype.getName = function() { return this.name; }; MyObject.prototype.getMessage = function() { return this.message; };

2. Prototyp

Verwandte Empfehlungen:

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung des Anwendungscodes des js-Abschlusses und des Prototyps. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!