JavaScript 函数的参数是否对其回调函数不可见？

Question

我想获得此代码的 1 3 2 输出，有和没有使用承诺。

let data = 1;
console.log(data);

data = 2;
setTimeout((data) => {
  console.log(data);
}, 2000);

data = 3;
console.log(data);

let data = 1;
console.log(data);

data = 2;
setTimeout((data) => {
  console.log(data);
}, 2000,data);

data = 3;
console.log(data);

此代码按预期给出输出 1 3 2，但是

console.log(data);

data = 2;
setTimeout(() => {   // argument removed from callback function
  console.log(data);
}, 2000,data);

data = 3;
console.log(data);

此代码给出输出 1 3 3，但为什么呢？ 为什么这个回调函数没有使用 setTimeout 中传递的数据参数。

我也使用了 promise 但仍然得到 1 3 3 作为输出。

let data=1;
console.log(data);

data=2;
temp=new Promise((resolve, reject)=>{
    // async code
    setTimeout(()=>{
      resolve(data);
    },2000);

})

temp.then((temp)=>{
    console.log(temp);
    }).catch((err)=>{console.log(err);}
);

data=3;
console.log(data);

Answer 1

它与闭包有关。

在此示例中，您在调用 setTimeout (2) 时将

data

的值传递给

setTimeout

，该值稍后将传递给回调，因此您得到了您期望的

1,3,2

输出。

let data = 1;

console.log(data);

data = 2;
setTimeout((data) => {
  console.log(data);
}, 2000,data);

data = 3;

console.log(data);

但是在这种情况下，

data

参数已从 setTimeout 调用中删除，您的回调从外部范围引用变量，并且在回调运行时它的值已经更改为 3。所以你得到

1,3,3

.

let data = 1;
console.log(data);

data = 2;
setTimeout(() => {   // argument removed from callback function
  console.log(data);
}, 2000,data);

data = 3;
console.log(data);