HTML网页中JavaScript Promise无法正常运行问题排查求助

你的HTML代码没有语法错误，引用也不存在问题，页面空白的核心原因是Promise的错误分支未被处理：

• 你定义的toldThePeople值为"BBQ Cauliflower"，而Promise内部的order值为"BBQ Corn"，两者不相等，所以Promise触发了reject分支；
• 但你只通过.then()绑定了Promise成功（resolve）时的回调，没有处理失败（reject）的情况，导致reject时没有代码去更新页面的demo元素内容，所以页面无显示。

修复方法 #

方法1：让条件成立触发resolve #

修改变量值，让toldThePeople和order相等：

let toldThePeople = "BBQ Corn";
// 或者修改Promise内的order值
let order = "BBQ Cauliflower";

方法2：添加reject的处理逻辑 #

给Promise添加.catch()来捕获reject的内容，更新页面：

restaurantOrder.then(function (value) {
  display(value);
}).catch(function (error) {
  display(error); // 此时会显示"I WANT THE MANAGER!!!"
});

或者使用.then()的第二个参数直接处理reject：

restaurantOrder.then(function (value) {
  display(value);
}, function (error) {
  display(error);
});

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