JavaScript Promise使用中遭遇语法错误的排查求助

错误根源 #

你的代码里有两处关键问题，直接触发语法报错的是new Response(emsg, String);这一行：

• Response构造函数的第二个参数要求是配置对象（比如包含status、headers等属性），但你传了String构造函数，这会让JavaScript解析器产生混淆——它预期这里是对象字面量的{，却提前遇到了后续的代码符号，从而抛出unexpected token ')'错误。
• 另外，return(url);里的括号属于冗余写法（虽然语法上合法），部分解析器可能会将其与后续的闭合括号混淆，建议简化为return url;。

修正后的代码 #

return fetch("bad://" + url)
       .then((response) => {
           var subst = response;
           if (!response.ok) {
              var emsg = "<span style='color:red'><b>ERROR</b></span>[" + response.status + "]: " + url;
              // 修正Response构造函数的第二个参数为合法配置对象
              subst = new Response(emsg, {
                  status: response.status,
                  headers: { 'Content-Type': 'text/html' }
              });
           }
           return subst;
        })
       .then(response => response.text())
       .then((html) => {
           return extractHtml(html, url);
        })
       .then((html) => {
           if (!el.parentNode) {
              return;
           }
           el.insertAdjacentHTML("beforebegin", html.repeat(repeat));
           el.parentNode.removeChild(el);
           // 移除多余括号
           return url;
        })
       .catch((error) => {
           console.error('Failed to fetch(): ' + error.message);
           return;
        })

补充说明 #

你提到移除末尾部分后代码不报错，是因为那段不完整的代码（缺少最后一个.then的闭合括号和.catch块）在部分环境（比如浏览器控制台的多行输入模式）中不会被完整解析，所以没有触发语法检查。

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