为什么JS函数内前两个变量为undefined而第三个变量已定义？

核心是自定义函数的返回值逻辑错误：

• 你定义的getRandomNum函数仅打印了生成的随机数，没有写return语句返回计算结果。JS中所有没有显式写返回值的函数，执行后默认返回undefined。
• 执行deal函数时，你把firstCard、secondCard两个变量重新赋值为getRandomNum()的返回值，自然这两个变量就变成了undefined。
• dealButton变量从初始化后没有被修改过，一直存储着获取到的按钮DOM对象，所以打印时显示已定义。

给getRandomNum函数添加返回语句即可，修改后的代码如下：

// 生成1-11范围内的随机数
function getRandomNum() {
  let ranNum = Math.floor(Math.random() * 11) + 1;
  console.log(ranNum);
  return ranNum; // 新增返回语句
}

如果你的业务需求是要把随机数渲染到对应的p标签中，那deal函数的赋值逻辑也需要对应调整，示例如下：

function deal() {
  // 把随机数赋值给卡片对应的DOM节点的文本内容
  firstCard.textContent = getRandomNum();
  secondCard.textContent = getRandomNum();

  console.log(firstCard.textContent); 
  console.log(secondCard.textContent);
  console.log(dealButton);
}

内容的提问来源于stack exchange，提问作者Eric Nguyen