JavaScript: Again on settimeout, SetInterval. A discussion of its third parameter and this, time-out nesting and memory leaks

Source: Internet
Author: User

Recently with SetTimeout, setinterval, because the function to be passed to use this, so in-depth understanding of some!


The third argument to the settimeout and setinterval functions was to simply define the language type, which was later supported in non-IE browsers and supported under different browsers.

The original settimeout function definition:
var Timeoutid = Window.settimeout (func, delay[, Lang]);

The definitions under Chrome and FF are modified:
var Timeoutid = window.settimeout (func, delay, [param1, Param2, ...]);
var timeoutid = window.settimeout (code, delay);

IE: The third parameter is not supported.
Chrome: Accepted parameter = number of arguments passed.
FF: Accepted parameter = number of arguments passed +1

For more details, refer to: Https://developer.mozilla.org/zh-CN/docs/DOM/window.setTimeout

Recommended to look at the site, and then read the article, the effect is better!

Programmers look at code and stick to a detailed annotated code:

(function (w) {//ie passed in the third parameter if (! + [1,]) {//except IE,!+[1,] is returned false (function (OVERRIDEFN) {// Overridefn should be changed to Wrapcallw.settimeout = Overridefn (w.settimeout); w.setinterval = Overridefn (W.setInterval);}) (function (ORIGINALFN) {//wrapper function, only up to two rows called, only one parameter one class setinterval return function Originalfn.ispolyfill = True;//fix ie9--// Notice that return replaces the function, not the return value of the call. Returns the Settimeout,setintervalreturn function (code, delay) that is really being replaced {//This is the real overridefnvar me = This,//fix: Activates the this scope where code is located, args = Array.prototype.slice.call (arguments, 2), and return ORIGINALFN (function () {//Call the original apiif here (typeof Code = = ' String ') {eval (code);} else {code.apply (me, args),}}, delay),})}) (window);

Previous segment code modified from: http://mao.li/javascript/javascript-settimeout-params/

Very concise, the cat has also been modified from the MDN! I commented in detail, as long as the invocation of the anonymous function is understood.

Now you can test it:

MyArray = ["Zero", "one", "];myarray.mymethod" = function (Sproperty) {    

Note Two: You still have to call or apply; a callback to settimeout if it's a string, the third argument doesn't make sense!

Another disadvantage of the above code is that the original settimeout "pointer" is not saved to return function (code, delay) {//This is the real overridefn

This line of code after the data, but the consideration of JS is not native support Oo, this flaw is still acceptable!


Now, I'd like to focus on the settimeout timeout call, especially in the loop

while (!flag) {//waits for asynchronous completion of ==> code intent: Polls the asynchronous completion flag every 30 milliseconds, waits for completion, yields execution response to user events, and intends to implement a sleep-like effect settimeout (null, 30);}

The above code looks as if it's okay, polling the asynchronous completion flag every 30 milliseconds ~ but JS is single-threaded

So, this is a dead loop, constantly create a timeout timer, other code can not change the completion flag! I'll be dead in one or two minutes! The solution is the callback!

The asynchronous completion flag can be polled in the callback function using the timer setinterval. But the best way to do this is to set the callback in the asynchronous operation! JS is also annoying, sometimes a lot of callbacks nested three or four layers, so OO code implementation is a bit cumbersome!


The last point, JS engine single-threaded, queue-type execution:

SetTimeout (FN, 0);//fn does not execute immediately, but the previous execution queue completes to execute

HTML5: settimeout minimum timeout of 4ms


Resources:

http://mao.li/javascript/javascript-settimeout-params/
Https://developer.mozilla.org/zh-CN/docs/DOM/window.setTimeout

JavaScript: Again on settimeout, SetInterval. A discussion of its third parameter and this, time-out nesting and memory leaks

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.