1. 程式人生 > >js中setTimeout() 時間引數為0

js中setTimeout() 時間引數為0

當看到下面 這種setTimeout 設定為0 寫法的時候一臉懵逼,完全沒用過。

var fuc = [1,2,3];
for(var i in fuc){
  setTimeout(function(){console.log(fuc[i])},0);
  console.log(fuc[i]);
}

  

問:控制檯會如何列印?

chrome列印結果如下:

 

setTimeout(0)的意思

SetTimeout為在一個指定的延遲時間後執行某個函式,所以如果帶入(0),則是否意味馬上執行的意思?來看下面程式碼。

setTimeout(function(){
   console.log("Hello");
},0)
console.log("Mark");
執行結果為:
Mark
Hello

嚴來來說不是立即執行,而是立即排進Task Quenu等待執行,等Call Stack空時它會至Task Quenu尋找工作,因此執行結果才為Mark Hello

如果不知道Task QuenuCall Stack可至該篇看Event Driven的觀念。

http://marklin-blog.logdown.com/posts/294474-javascript-event-driven

setTimeout非同步的範例

首先看看下面的程式碼,doSomething函式需要等到取得到data才執行,但getData會執行很久,但下面的doSomething1與

2不需要data就可以執行,所以這時這種寫法就會很浪費時間。

var data = getData();
doSomething(data);

doSomething1();
doSomething2();

所以我們將getDatafucntion修改為如下。

function getData(callBack){         
    setTimeout(function(){
        //getData要執行的程式碼

        callBack();
    },10);
}

然後我們整段程式碼就可以改成。

getData(doSomething);
doSomething1();
doSomething2();

上面這種寫法,我們把同步操作轉變成非同步操作,getData不會阻塞住整個執行緒,以上就是其種一種的非同步的寫法,但這種寫法有個缺點就是很容易變成CallBack地獄。