显示错误消息并在承诺中返回 null

Question

我如何在控制台中显示错误并在iif的第二部分中返回值，如下所示：

return fetch(templatePath)

  .then((response) => response.ok ? response.text() : function() {

    console.error(`Template ${templatePath} not found.`);

    Promise.resolve(null);

  })

  .then((templateHtml) => {

    newElement.innerHTML = templateHtml;

    while (newElement.firstChild) {

      oldElement.appendChild(newElement.firstChild);

    }

  })

但这会将函数显示为字符串，而不是像我想要的那样继续使用 null。

Answer 1

脚本中有 2 个错误：是一个匿名函数，它不被调用，只是声明，function()匿名函数未返回声明的承诺Promise.resolve(null);溶液：return fetch(templatePath)  .then((response) => {    if (response.ok) return response.text();    console.error(`Template ${templatePath} not found.`);    return null;  })  .then(...

Answer 2

您不必创建函数，只需使用逗号运算符 （），该运算符计算两个操作数，并返回最后一个：,return fetch(templatePath)  .then(    (response) => response.ok ? response.text() : (console.error(`Template ${templatePath} not found.`), null)  )  .then((templateHtml) => {    newElement.innerHTML = templateHtml;    while (newElement.firstChild) {      oldElement.appendChild(newElement.firstChild);    }  })但是，如果发生错误，建议拒绝承诺：return fetch(templatePath)  .then(    (response) => response.ok ? response.text() : Promise.reject(new Error(`Template ${templatePath} not found.`))  )  .then((templateHtml) => {    newElement.innerHTML = templateHtml;    while (newElement.firstChild) {      oldElement.appendChild(newElement.firstChild);    }  })

Answer 3

如果出现错误，则不返回函数，只需返回 null。每个块返回一个承诺。当您返回不是 promise 的内容时，从传递给函数的回调函数，函数返回的 promise 将在回调函数返回时解析，并立即使用回调函数返回的非 promise 值实现。thenthenthen在您的例子中，如果发生错误，第一个函数调用返回的承诺将以 的值实现。thennull如果传递给函数的回调函数的返回值本身就是一个 promise，则函数调用返回的 promise 将被解析但尚未结算。仅当回调函数返回的 promise 已解决时，它才会结算。thenthen在您的情况下，如果为 true，回调函数将返回 promise 。函数调用返回的承诺将被解析，但只有在此承诺结算后才会结算。response.okresponse.textthenresponse.textreturn fetch(templatePath)  .then((response) => {    if (response.ok) return response.text();     console.error(`Template ${templatePath} not found.`);     return null;  })  .then((templateHtml) => {    newElement.innerHTML = templateHtml;    while (newElement.firstChild) {      oldElement.appendChild(newElement.firstChild);    }  })

Answer 4

明白了return fetch(templatePath)  .then((response) => {    if (response.ok) {      return response.text();    }    else {      console.error(`Template ${templatePath} not found.`);      return Promise.resolve(null);    }  })  .then((templateHtml) => {    newElement.innerHTML = templateHtml;    while (newElement.firstChild) {      oldElement.appendChild(newElement.firstChild);    }  })