JavaScript中setInterval多次执行函数无法获取正确值问题

你拿到错误值的核心原因是JavaScript的异步任务执行机制，外加代码里存在拼写错误，双重问题导致结果不符合预期：

• setInterval、setTimeout注册的回调都是异步宏任务，注册之后不会阻塞后面同步代码执行，必须等当前所有同步代码全部跑完、主线程空闲时，才会按触发顺序执行这些回调。
• 你写的console.log(testTime)是全局作用域下的同步代码，在两个定时任务刚注册完、回调一次都没执行的时候就已经运行了，这时候testTime根本还没被interval回调赋值，自然拿不到累计后的10。
• 额外的拼写bug：JS对大小写敏感，你写的setTimeOut是错误写法，正确API名是setTimeout（timeout的o为小写），写错的话10秒后停止interval的逻辑会直接报函数未定义的错，根本不会执行。

不要在同步流程里直接读取异步更新的变量，把打印值的逻辑挪到10秒的定时回调里，等interval被清除的时候再读值就对了，修正后的代码如下：

var time = 0;
var timeInterval;
var testTime;

// 每秒累加time值
timeInterval = setInterval(function (){
    time++;
    testTime = time;
}, 1000);

// 10秒后停止计时并打印结果
setTimeout(function() {
    clearInterval(timeInterval);
    console.log(testTime);
}, 10000);

补充说明：受浏览器定时器精度、事件循环任务排队延迟影响，最终打印值可能在9-11之间浮动，属于正常现象，不是代码逻辑错误。

内容的提问来源于stack exchange，提问作者Philip Franklin