写代码啦
JS 函数的执行时机
回复数(0) 浏览数(25)
{{topic.upvote_count || 0}} 编辑 回复

JS 函数的执行时机

严格意义上来说,javascript没有多线程的概念,所有的程序都是单线程依次执行

什么是单线程?

简单点来说就是代码在执行过程中,另一段代码想要执行,必须等待前一段代码执行完成后才可以进行.

就像下面这样:

let i = 0;
for(i=0;i<6;i++){
  setTimeout(()=>{
    console.log(i)
  },0)
}

上面的这段代码,既然延时器时间设置为0,那么应该执行一遍循环就应该立即打印出一个i,但是最终的打印结果为:6,6,6,6,6,6。

之所以会出现上面的结果,正是因为js代码是单线程应用

在执行过程中,先遇到for循环,for循环先进入线程。当i=1时,循环走到setTimeOut后,此时的for循环还没有执行完成,setTimeOut就会被放入一个地方(线程池)等待执行。此时for循环继续执行,当i=2时,for循环仍没有执行完,这时的setTimeOut仍会被放在线程池中等待执行……依次类推,直到for循环执行完了,此时线程空闲了,在线程池中等待执行的setTimeOut依次执行打印i,而for循环执行完成后,i变成了6,所以打印出了6,6,6,6,6,6.

怎样让结果为1,2,3,4,5,6

//将var变为let
for(let i=1; i<=6; i++){
 setTimeOut(function(){
  console.log(i); //输出的结果为1,2,3,4,5,6
 },0);
}

//或者

for(var i=1; i<=3; i++){
    !function(i){
        setTimeOut(function(){
            console.log(i);  //输出的结果为1,2,3
        },0);
    }(i)
} //这样每次循环后,立即执行函数都会立即执行,不会等待for循环结束

因为setTimeout为异步函数,每次都在for循环完成后才会执行.上面那个var=0是个全局变量可以这样理解:

img img

由上图可以解释为什么是6个6.

let i=0时,因为是局部变量,六次循环,每次的循环结果都会保留.所以是1,2,3,4,5,6

{{topic.upvote_count || 0}}

JS 函数的执行时机

严格意义上来说,javascript没有多线程的概念,所有的程序都是单线程依次执行

什么是单线程?

简单点来说就是代码在执行过程中,另一段代码想要执行,必须等待前一段代码执行完成后才可以进行.

就像下面这样:

let i = 0;
for(i=0;i<6;i++){
  setTimeout(()=>{
    console.log(i)
  },0)
}

上面的这段代码,既然延时器时间设置为0,那么应该执行一遍循环就应该立即打印出一个i,但是最终的打印结果为:6,6,6,6,6,6。

之所以会出现上面的结果,正是因为js代码是单线程应用

在执行过程中,先遇到for循环,for循环先进入线程。当i=1时,循环走到setTimeOut后,此时的for循环还没有执行完成,setTimeOut就会被放入一个地方(线程池)等待执行。此时for循环继续执行,当i=2时,for循环仍没有执行完,这时的setTimeOut仍会被放在线程池中等待执行……依次类推,直到for循环执行完了,此时线程空闲了,在线程池中等待执行的setTimeOut依次执行打印i,而for循环执行完成后,i变成了6,所以打印出了6,6,6,6,6,6.

怎样让结果为1,2,3,4,5,6

//将var变为let
for(let i=1; i<=6; i++){
 setTimeOut(function(){
  console.log(i); //输出的结果为1,2,3,4,5,6
 },0);
}

//或者

for(var i=1; i<=3; i++){
    !function(i){
        setTimeOut(function(){
            console.log(i);  //输出的结果为1,2,3
        },0);
    }(i)
} //这样每次循环后,立即执行函数都会立即执行,不会等待for循环结束

因为setTimeout为异步函数,每次都在for循环完成后才会执行.上面那个var=0是个全局变量可以这样理解:

img img

由上图可以解释为什么是6个6.

let i=0时,因为是局部变量,六次循环,每次的循环结果都会保留.所以是1,2,3,4,5,6

25
回复 编辑