|
|
先來(lái)一段代碼，大家猜猜在各種瀏覽器下的結(jié)果會(huì)是怎么樣的呢？
復(fù)制代碼 代碼如下:
function f(){
var s = 'arguments.length:'+arguments.length+'; ';
for(var i=0,n=arguments.length;i< n;i++){
s += ' ['+i+']:'+arguments[i]+'; ';
}
alert(s);
}
setTimeout(f,500,"Javascript","AAA")
我這里要探討的，不是什么時(shí)候該用哪一個(gè)，而是探討這兩個(gè)方法在各瀏覽器中的差異。
原先我一直沒(méi)覺(jué)得這兩個(gè)方法會(huì)有什么烏龍，一個(gè)偶然的機(jī)會(huì)讓我得知了，現(xiàn)在整理一下寫(xiě)出來(lái)和大家分享。
因?yàn)閟etTimeout與setInterval的參數(shù)和用法是一樣的，只是功能不同，所以，為了省事，我下面只以setTimeout為例進(jìn)行說(shuō)明以及舉例。
setTimeout被最經(jīng)常用到的形式大概是如下2種樣子的：
復(fù)制代碼 代碼如下:
iTimerID = setTimeout(strJsCode, 50) //strJsCode為一個(gè)包含js代碼的字符串
iTimerID = setTimeout(objFunction, 50) //objFunction為一個(gè)函數(shù)對(duì)象
第一種調(diào)用方式是傳包含js代碼的字符串，這種方式的好處是簡(jiǎn)潔，但壞處是運(yùn)行效率差，而且不利于語(yǔ)法解析，有潛在風(fēng)險(xiǎn)，更重要的是，處理比較復(fù)雜的內(nèi)容比較費(fèi)勁，這一點(diǎn)和eval的弊端是一致的。
所以，我們認(rèn)為，通常應(yīng)當(dāng)采用第二種方式調(diào)用為好。（后面我的例子均采用第2種調(diào)用方式）
現(xiàn)在來(lái)揭曉開(kāi)頭那一段代碼在各種瀏覽器下的結(jié)果：
IE(6,7,8)是： arguments.length:0;
Opera(6,7,8)是： arguments.length:2; [0]:Javascript; [1]:AAA;
Firefox(3.0)是： arguments.length:3; [0]:Javascript; [1]:AAA; [2]:-15;
竟然有這么大的差別，還真是“你唱你的曲，我哼我的調(diào)”！
Firefox(3.0)下，得出的最后一個(gè)數(shù)字是不特定的，有時(shí)候是0，有時(shí)候是一個(gè)負(fù)數(shù)，這問(wèn)題后面再說(shuō)。
（一）IE系列中的setTimeout
首先，我們看看微軟出的DHTML參考手冊(cè)中是如何說(shuō)的：
setTimeout Method
Evaluates an expression after a specified number of milliseconds has elapsed.
Syntax
iTimerID = window.setTimeout(vCode, iMilliSeconds [, sLanguage])
Parameters
vCode Required. Variant that specifies the function pointer or string that indicates
the code to be executed when the specified interval has elapsed.
iMilliSeconds Required. Integer that specifies the number of milliseconds.
sLanguage Optional. String that specifies one of the following values:
JScript Language is JScript.
VBScript Language is VBScript.
JavaScript Language is JavaScript.
MSDN上關(guān)于setTimeout的說(shuō)明：
http://msdn.microsoft.com/en-us/library/ms536753(VS.85).ASPx
也就是說(shuō)，setTimeout接收3個(gè)參數(shù)，第3個(gè)參數(shù)表示腳本語(yǔ)言的類(lèi)型，如果你再傳入更多的參數(shù)，是無(wú)意義的。
因此，在IE中，以下兩種都是對(duì)的。
setTimeout('alert(1)', 50);
setTimeout('msgbox "終止、重試、忽略，您看著辦吧。", vbAbortRetryIgnore + vbDefaultButton2, "告訴您"', 50, 'VBScript');
（二）Mozilla系列中的setTimeout
我們看看Mozilla官方網(wǎng)站上 Gecko DOM Reference 手冊(cè)中是如何說(shuō)的：
window.setTimeout
Summary
Executes a code snippet or a function after specified delay.
Syntax
var timeoutID = window.setTimeout(func, delay, [param1, param2, ...]);
var timeoutID = window.setTimeout(code, delay);
前兩個(gè)參數(shù)都一樣，沒(méi)差別，從第三個(gè)參數(shù)就不同了。
因?yàn)槟壳爸挥蠭E瀏覽器支持多種語(yǔ)言的腳本，其它瀏覽器只支持js腳本所以不需要傳語(yǔ)言類(lèi)型的參數(shù)。
Mozilla把傳給setTimeout的第3個(gè)以及更后面的更多參數(shù)依次的傳給前面的func做為參數(shù)。
Firefox, Opera, Safari, Chrome等等也都是如此。
但是注意到，Mozilla上說(shuō)了他家的setTimeout有一個(gè)叫做"Lateness" argument的BUG.
"Lateness" argument
Functions invoked by setTimeout are passed an extra "lateness" argument in Mozilla,
i.e., the lateness of the timeout in milliseconds. (See bug 10637 and bug 394769.)
這就是開(kāi)頭那個(gè)例子中，F(xiàn)irefox(3.0)下有一個(gè)烏龍數(shù)字的根源。
Mozilla上關(guān)于setTimeout的說(shuō)明：
https://developer.mozilla.org/en/DOM/window.setTimeout
（三）其它瀏覽器系列(Opera, Safari, Chrome)中的setTimeout
和Mozilla系列中的基本一樣，但是沒(méi)有Mozilla系列中的多一個(gè)參數(shù)的BUG.
武林外傳：使用setTimeout的小技巧
(1)IE中給setTimeout中的調(diào)用函數(shù)傳參數(shù)
上面的分析可知，IE是不支持在setTimeout中給被調(diào)用的函數(shù)傳參數(shù)的，為了瀏覽器世界的和諧，我們可以把函數(shù)調(diào)用參數(shù)包裹進(jìn)新的匿名函數(shù)中。示例：
復(fù)制代碼 代碼如下:
function f(a){
alert(a);
}
// setTimeout(f,50,'hello'); //用于非IE
setTimeout(function(){f('hello')},50); //通用
var str='hello';
setTimeout(function(){f(str)},50); //通用
(2)this問(wèn)題
setTimeout調(diào)用的函數(shù)被執(zhí)行時(shí)的上下文是全局，而不再是調(diào)用setTimeout方法時(shí)的上下文。所以，setTimeout的第一個(gè)參數(shù)的函數(shù)被執(zhí)行時(shí)其this是指向window的，如果需要保留調(diào)用setTimeout方法時(shí)的this，就需要把當(dāng)時(shí)的this傳進(jìn)去。示例：
復(fù)制代碼 代碼如下:
function Person(name){
this.name=name;
var f=function(){alert('My name is '+this.name)};
// setTimeout(f,50); //錯(cuò)誤
var THIS=this;
setTimeout(function(){f.apply(THIS)},50); //正確，通用
setTimeout(function(){f.call(THIS)},50); //正確，通用
}
new Person('Jack');
要說(shuō)的就這些了。
發(fā)帖子不是腦力活，其實(shí)是體力活，組織文字，寫(xiě)例子，排版，這些沒(méi)技術(shù)含量的事情是最累人最耗時(shí)間的。
JavaScript技術(shù)：setTimeout與setInterval在不同瀏覽器下的差異，轉(zhuǎn)載需保留來(lái)源！
鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除，多謝。
