SetTimeout and setInterval are two amazing methods of window objects. They are used to call a function or code at a scheduled or delayed time. (New users may think that setTimeout and setInterval are javascript Functions, which is incorrect. Beginners can easily confuse javascript Object functions with DOM object methods .)
Let's start with a piece of code. Let's guess what the results will look like in various browsers?
The Code is as follows:
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 ")
What I want to discuss here is not when to use it, but the difference between the two methods in different browsers.
I have never thought that these two methods would have had any problem. I was notified by an occasional opportunity. Now I want to write it out and share it with you.
Because the parameters and usage of setTimeout and setInterval are the same, but the functions are different, in order to save trouble, I will only use setTimeout as an example to describe and give an example.
The most frequently used form of setTimeout is probably the following two types:
The Code is as follows:
ITimerID = setTimeout (strJsCode, 50) // strJsCode is a string containing js Code
ITimerID = setTimeout (objFunction, 50) // The objFunction is a function object.
The first method of calling is to upload a string containing the js Code. The advantage of this method is conciseness, but the disadvantage is that the running efficiency is poor, and it is not conducive to Syntax Parsing and has potential risks. More importantly, it is difficult to deal with complicated content, which is consistent with the disadvantages of eval.
Therefore, we think it is better to use the second method. (The following examples all use 2nd call methods)
Now let's reveal the results of the first piece of code in various browsers:
IE (6, 7, 8) is: arguments. length: 0;
Opera (6, 7, 8) is: arguments. length: 2; [0]: javascript; [1]: AAA;
Firefox (3.0) is: arguments. length: 3; [0]: javascript; [1]: AAA; [2]:-15;
There is such a big difference, it is really "you sing your song, I am not my tune "!
In Firefox (3.0), the last number is not specific. Sometimes it is 0 or a negative number.
(1) setTimeout In the IE Series
First, let's look at how Microsoft's DHTML reference manual says:
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.
Description of setTimeout on MSDN:
The http://msdn.microsoft.com/en-us/library/ms536753 (VS.85). aspx
That is to say, setTimeout receives three parameters, and 3rd parameters indicate the type of the script language. If you input more parameters, it is meaningless.
Therefore, in IE, either of the following is true.
SetTimeout ('alert (1) ', 50 );
SetTimeout ('msgbox "ends, retries, and ignores the request. ", VbAbortRetryIgnore + vbDefaultButton2," tell you "', 50, 'vbscript ');
(2) setTimeout in Mozilla Series
Let's take a look at what Gecko DOM Reference says on Mozilla's official website:
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 );
The first two parameters are the same and there is no difference. The third parameter is different.
Currently, only the IE browser supports scripts in multiple languages. other browsers only support js scripts, so language parameters are not required.
Mozilla uses the first parameter that is passed to setTimeout and the more parameters that follow it to the preceding func as the parameter.
Firefox, Opera, Safari, Chrome, and so on.
However, Mozilla mentioned that the setTimeout of his family has a BUG called "Lateness" argument.
"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 .)
In the example at the beginning, Firefox (3.0) has the root of an Oolong number.
Description of setTimeout on Mozilla:
Https://developer.mozilla.org/en/DOM/window.setTimeout
(3) setTimeout in other browser series (Opera, Safari, Chrome)
It is basically the same as that in the Mozilla series, but there is no BUG with one more parameter in the Mozilla series.
Wu Lin: Tips for using setTimeout
(1) pass parameters to the call function in setTimeout in IE
According to the above analysis, IE does not support passing parameters to the called function in setTimeout. To ensure the harmony of the browser world, we can wrap the function call parameters into the new anonymous function. Example:
The Code is as follows:
Function f (){
Alert ();
}
// SetTimeout (f, 50, 'Hello'); // used for non-IE
SetTimeout (function () {f ('hello')}, 50); // common
Var str = 'hello ';
SetTimeout (function () {f (str)}, 50); // common
(2) this problem
The context when the setTimeout function is called is global, instead of the context when the setTimeout method is called. Therefore, when the function of the first setTimeout parameter is executed, this points to window. If you need to retain this when the setTimeout method is called, you need to pass this in. Example:
The Code is as follows:
Function Person (name ){
This. name = name;
Var f = function () {alert ('My name is '+ this. name )};
// SetTimeout (f, 50); // Error
Var THIS = this;
SetTimeout (function () {f. apply (THIS)}, 50); // correct, common
SetTimeout (function () {f. call (THIS)}, 50); // correct, common
}
New Person ('jack ');
That's all you have to say.
Posting is not a mental task. It is actually a physical task, organizing texts, writing examples, and typographical tasks. The least technical tasks are the most time-consuming.
