为什么 promise 不识别变量而只是返回未定义的？

Question

我刚开始学习 javascript 中的 promises 并且正在玩这个玩具示例

我定义了一个函数，它在 1 秒后吐出一个 0 到 10 之间的随机数来模拟从 API 获取数据

function randNum() {
  setTimeout(() => {
    let num =(Math.random()) * 10 
    return num
  }, 1000)
}

然后我定义了一个函数，它返回一个承诺，如果随机数 > 5 则解决，如果 <5 则拒绝

function myPromise() {
  return new Promise((resolve, reject) => {
    let myNum = randNum()
    setTimeout(() => {
      if (myNum > 5) {
        resolve(myNum)
      } else {
        reject(myNum)
      }
    }, 2000)
  })
}

承诺在 2 秒后被解决或拒绝......所以 myNum 的值应该在那时分配......但是当我尝试使用承诺时

myPromise().then((myNum) => { console.log(myNum); }).catch((myNum) => { console.log(myNum) })

它只是返回未定义

我在这里做错了什么？？我不太了解承诺

Answer 1

randNum() 没有明确返回任何东西。它没有返回语句。 let myNum = randNum() 等同于 randNum(); let myNum = undefined。

当您定义和使用命名函数而不是匿名 lambda 函数时，您可以看到它：

function myRand() {
  let num = Math.random() * 10 
  return num;
}

function randNum() {
  setTimeout(myRand, 1000); // There is no return statement in randNum
}

要么删除setTimeout：

function randNum() {
  let num = Math.random() * 10;
  return num;
}

function myPromise(val) {
  return new Promise((resolve, reject) => {
    let myNum = randNum();
    setTimeout(() => {
      if (myNum > 5) {
        resolve(myNum);
      } else {
        reject(myNum);
      }
    }, 2000);
  });
}
myPromise(10).then((myNum) => { console.log(myNum); }).catch((myNum) => { console.log(myNum.toString()) });

或返回Promise：

function randNum() {
  return new Promise(resolve => {
    setTimeout(() => {
        let num = Math.random() * 10;
        resolve(num);
    }, 1000);
  });
}

function myPromise(val) {
  return new Promise(async (resolve, reject) => {
    let myNum = await randNum();
    setTimeout(() => {
      if (myNum > 5) {
        resolve(myNum);
      } else {
        reject(myNum);
      }
    }, 2000);
  });
}
myPromise(10).then((myNum) => { console.log(myNum); }).catch((myNum) => { console.log(myNum.toString()) });

将 sleep 函数与 async/await 一起使用通常被认为更具可读性：

function sleep(ms) {
  return new Promise(resolve => { setTimeout(resolve, ms); });
}

async function randNum() {
  await sleep(1000);
  let num = Math.random() * 10;
  return num;
}

async function myPromise(val) {
  let myNum = await randNum();
  await sleep(2000);
  if (myNum > 5) {
    return myNum;
  } else {
    throw myNum;
  }
}
myPromise(10).then((myNum) => { console.log(myNum); }).catch((myNum) => { console.log(myNum.toString()) })