为什么我无法读取嵌套函数中全局变量的变化?

0 javascript nested-function

//这是关于嵌套函数和计时器函数的代码问题

    var num = 0; //the key of this problem
	var timer = null;
	timer = setInterval(function() {
        //num could change from 0 to 9 in this function
		console.log(num); 
		setTimeout(function() {
		console.log(num); //but in this place, num is always 0,why?
		}, 2000);	

		num++;					
		if (num >= 10) {						
			num = 0;
		clearInterval(timer);
		}
	}, 100);
Run Code Online (Sandbox Code Playgroud)

T.J*_*der 5

为什么我无法读取嵌套函数中全局变量的变化?

你是.这只是一个逻辑错误,当您的setTimeout回调发生时,您已将其设置 0:您num每100ms 递增一次,当它达到10时将其设置为0然后停止递增过程.在2000ms之后,你显示的值num.此时,它将为0,因为它以10毫秒的间隔以100毫秒的间隔达到0,比较早一秒.

换句话说,这是发生的事情:

  1. 时间0ms:您设置num为0
  2. 时间0ms:您setInterval在100ms 设置重复间隔计时器()
  3. 时间~100ms:间隔第一次触发:
    1. 它设置了2000ms后的第一个回调
    2. 变更num为1
  4. 时间~200ms:间隔第二次触发:
    1. 它设置了2000ms后的第一个回调
    2. 变更num为2
  5. 这种情况再次发生在~300ms(num - > 3),~400ms(num - > 4),~500ms(num - > 5),~600ms(num - > 6),~700ms(num - > 7),〜 800ms(num - > 8),~900ms(num - > 3)
  6. 时间~1000ms:间隔最后一次触发:
    1. 它在2000ms后又建立了另一个回调
    2. 它将num设置为10,然后设置为0并取消间隔
  7. 时间~2100ms:第一个setTimeout回调触发,显示num = 0
  8. 时间~2200ms:第二次setTimeout回调触发,显示num = 0
  9. ...等等