setTimeout面试失利总结

534 阅读2分钟

setTimeout

写这篇文章是因为之前第一次面试吃了亏,当时面试官问了关于setTimeout的一些问题,没回答上来,所以记录一下。

问题一 参数

第一个参数可以是function也可以是字符串(在后面应用),第二个参数为delay,第二个参数之后的参数会在定时器到期时作为参数传给function

栗子:

setTimeout(function () {
  console.log(arguments)
}, 1000, 100, 200, 300)

一秒之后执行输出

[Arguments] { '0': 100, '1': 200, '2': 300 }

还可以传入setTimeout

setTimeout(function () {
  console.log(1)
}, 1000, setTimeout(() => {
  console.log(2)
}, 2000), setTimeout(() => {
  console.log(2)
}, 2000))

第一秒的时候输出1,第二秒的时候同时输出两个2

问题二 返回值

返回值是一个正整数,表示定时器的编号(number类型)。这个值可以传递给clearTimeout()来取消该定时器。这个编号值跟setInterval的编号池同用。

问题三 delay为0

setTimeout(() => {}, 0)

 console.log('a');
setTimeout(function(){
    console.log('b');
},0);
console.log('c');
console.log('d');

控制台输出:

a

c

d

b

理论上他延迟时间为0,应该是马上执行,但是不是这样的。因为setTImeout是宏任务,而console.log是微任务,js运行机制会把当前脚本的微任务和“任务队列中”已有的任务、全部处理完之后,才会执行setTimeout指定的任务,即setTimeout为异步执行,异步任务都会添加到任务队列中。

拓展:setTimeout(fn,0) 在浏览器中运行并不是真的0 MDN上说了>=4ms 也就是说至少大于等于4ms。

应用

计时器

function ddd() {
    console.log(new Date().getSeconds())
    setTimeout('ddd()', 1000)
}
ddd()

面试题

for (var i = 0; i < 10; i++) {
  setTimeout(() => {
    console.log(i)
  })
}

// 输出0 1 2 3 4 5 6 7 8 9 

for (var i = 0; i < 10; i++) {
    console.log(i)
}

// 输出 10个10