Heim > Web-Frontend > js-Tutorial > Hauptteil

Eine Erklärung der JS-Timer- und Schließungsprobleme

jacklove
Freigeben: 2018-05-21 11:19:59
Original
1781 Leute haben es durchsucht

Dieser Artikel enthält relevante Erklärungen zu JS-Timern und Schließungsproblemen.

Was ist ein Abschluss? Welche Funktion hat er?

Wenn eine Funktion die Berechtigung hat, auf Variablen innerhalb einer anderen Funktion zuzugreifen, kann diese interne Funktion als Abschluss bezeichnet werden.

Funktion:

Auf lokale Variablen innerhalb einer anderen Funktion zugreifen können

Die Werte dieser Variablen immer im Speicher behalten

Was ist die Rolle? von setTimeout 0

entspricht dem Platzieren dieses Codes am Ende des Ausführungscodes und seiner sofortigen Ausführung. Dieser Code wird sofort ausgeführt, nachdem alle Codes ausgeführt wurden.

Wie viel gibt der folgende Code aus? Ändern Sie den Code so, dass fnArr [i]() i ausgibt. Verwenden Sie mehr als zwei Methoden

方法一:    var fnArr = [];    for (var i = 0; i < 10; i ++) {
      (function(i){
        fnArr[i] =  function(){            return i;
        };
      } )(i);
    }    console.log( fnArr[3]() );
Nach dem Login kopieren
方法二:    var fnArr = [];    for (var i = 0; i < 10; i ++) {
      (function(){        var a = i;            //取消参数,还是运用闭包将i赋值给a
        fnArr[i] =  function(){            return a;
        };
      } )();
    }    console.log( fnArr[5]() );
Nach dem Login kopieren

Verwenden Sie einen Abschluss, um ein Autoobjekt zu kapseln. Sie können den Autostatus auf folgende Weise erhalten:

var Car = (function(){  var speed = 0 ;  function setSpeed(n){
    speed = n ;
  }  
  function getSpeed(){    console.log(speed) ;
  }  
  function accelerate(){
   speed += 10 ; 
  }  
  function decelerate(){
   speed -= 10 ;
  }  
  function getStatus(){    if(speed>0){      console.log(&#39;running&#39;);
    }    if(speed===0){      console.log(&#39;stop&#39;);
    }
  }  
  return {    setSpeed:setSpeed,    getSpeed:getSpeed,    accelerate:accelerate,    decelerate:decelerate,    getStatus:getStatus,
  };
  
})();
Nach dem Login kopieren
Car.setSpeed(30);
Car.getSpeed(); //30Car.accelerate();
Car.getSpeed(); //40;Car.decelerate();
Car.decelerate();
Car.getSpeed(); //20Car.getStatus(); // &#39;running&#39;;Car.decelerate(); 
Car.decelerate();
Car.getStatus();  //&#39;stop&#39;;//Car.peed;  //error
Nach dem Login kopieren

Schreiben Sie eine Funktion mit setTimeout, um die Funktion von setInterval zu simulieren 🎜>

var a= 0;function intv(){
    setTimeout(function (){    console.log(a++);          
    intv();                //在子函数内调用父函数形成循环
  },1000);               //1秒后执行}
intv();              //执行父函数
Nach dem Login kopieren

Schreiben Sie eine Funktion, um die minimale Zeitgranularität von setTimeout zu berechnen

function num(){  var i =0;  var start= Date.now();  //获取当前时间毫秒赋值为start
  var clock = setTimeout(function(){  //为匿名函数设置定时器立即执行
    i++;                     //i每次+1
    if(i === 1000){           //条件为i执行1000次
      clearTimeout(clock);       //则取消定时器
      var end = Date.now();      //获取执行后时间毫秒赋值为end
      console.log((end-start)/i); //执行后时间-执行前时间再除以次数输出结果 
    } else{
    clock = setTimeout(arguments.callee,0)  //不到1000次再次执行此匿名函数
    }
  },0)
}
num();
Nach dem Login kopieren

Was ist das Ausgabeergebnis des folgenden Codes? Warum?

var a = 1;
setTimeout(function(){
    a = 2;    console.log(a);
}, 0);     //这里使用setTimeout 0,此代码最后执行,所以最后输出2var a ;console.log(a);   //输出为1a = 3;console.log(a);   //输出为3输出结果为:132
Nach dem Login kopieren

Was ist das Ausgabeergebnis von Folgender Code? Warum?

var flag = true;
setTimeout(function(){
    flag = false;
},0)        //此代码放置最后while(flag){}    //flag为true,代码在这里陷入无限循环   console.log(flag);
Nach dem Login kopieren

Das Ausgabeergebnis ist:

Leer, gefangen in einer Endlosschleife

Was ist die Ausgabe des folgenden Codes? So geben Sie Delayer aus: 0, Delayer: 1... (implementiert mit Schließungen)

for(var i=0;i<5;i++){
    setTimeout(function(){         console.log(&#39;delayer:&#39; + i );
    }, 0);            //此代码放置最后执行,i已变为5,输出delayer:5;
    console.log(i);   //循环输出 0,1,2 ,3 ,4}
for(var i=0;i<5;i++){
  (function(i){    function set(i){        console.log(&#39;delayer:&#39; + i );    
    }    return set(i);
  })(i); 
}
Nach dem Login kopieren

Das Ergebnis ist:

"delayer:0""delayer:1""delayer:2""delayer:3""delayer:4"
Nach dem Login kopieren
In diesem Artikel werden die JS-Timer- und Schließungsprobleme und mehr erläutert. Weitere Informationen Verwandte Inhalte, achten Sie bitte auf die chinesische PHP-Website.

Verwandte Empfehlungen:

So modularisieren Sie require.js mit Front-End-js

Ein mit CSS implementiertes Bild Abgeschlossen Schaltflächeninstanz

Relevante Kenntnisse über AJAX ASP/PHP-Anfrageinstanz

Das obige ist der detaillierte Inhalt vonEine Erklärung der JS-Timer- und Schließungsprobleme. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
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