JavaScript-Versprechen - ablehnen gegen werfen

Ich habe mehrere Artikel zu diesem Thema gelesen, aber es ist mir immer noch nicht klar, ob es einen Unterschied zwischen dem Promise.rejectAuslösen eines Fehlers gibt. Zum Beispiel,

Verwenden von Promise.reject

return asyncIsPermitted()
    .then(function(result) {
        if (result === true) {
            return true;
        }
        else {
            return Promise.reject(new PermissionDenied());
        }
    });

Mit werfen

return asyncIsPermitted()
    .then(function(result) {
        if (result === true) {
            return true;
        }
        else {
            throw new PermissionDenied();
        }
    });

Ich bevorzuge es throweinfach zu verwenden , weil es kürzer ist, habe mich aber gefragt, ob es einen Vorteil gegenüber dem anderen gibt.

Es gibt keinen Vorteil, einen gegenüber dem anderen zu verwenden, aber es gibt einen bestimmten Fall, in dem dies thrownicht funktioniert. Diese Fälle können jedoch behoben werden.

Jedes Mal, wenn Sie sich innerhalb eines Rückrufs befinden, können Sie diesen verwenden throw. Wenn Sie sich jedoch in einem anderen asynchronen Rückruf befinden, müssen Sie verwenden reject.

Dies löst beispielsweise nicht den Fang aus:

new Promise(function() {
  setTimeout(function() {
    throw 'or nah';
    // return Promise.reject('or nah'); also won't work
  }, 1000);
}).catch(function(e) {
  console.log(e); // doesn't happen
});

Stattdessen bleibt Ihnen ein ungelöstes Versprechen und eine nicht erfasste Ausnahme. Dies ist ein Fall, in dem Sie stattdessen verwenden möchten reject. Sie können dies jedoch auf zwei Arten beheben.

1. durch Verwendung der Ablehnungsfunktion des ursprünglichen Versprechens innerhalb des Timeouts:

new Promise(function(resolve, reject) {
  setTimeout(function() {
    reject('or nah');
  }, 1000);
}).catch(function(e) {
  console.log(e); // works!
});

2. durch das Versprechen des Timeouts:

function timeout(duration) { // Thanks joews
  return new Promise(function(resolve) {
    setTimeout(resolve, duration);
  });
}

timeout(1000).then(function() {
  throw 'worky!';
  // return Promise.reject('worky'); also works
}).catch(function(e) {
  console.log(e); // 'worky!'
});

Eine weitere wichtige Tatsache ist, dass der reject() Kontrollfluss NICHT wie bei einer returnAnweisung beendet wird. Im Gegensatz dazu throwwird der Kontrollfluss beendet.

Beispiel:

new Promise((resolve, reject) => {
  throw "err";
  console.log("NEVER REACHED");
})
.then(() => console.log("RESOLVED"))
.catch(() => console.log("REJECTED"));

vs.

new Promise((resolve, reject) => {
  reject(); // resolve() behaves similarly
  console.log("ALWAYS REACHED"); // "REJECTED" will print AFTER this
})
.then(() => console.log("RESOLVED"))
.catch(() => console.log("REJECTED"));

Ja, der größte Unterschied besteht darin, dass " Zurückweisen" eine Rückruffunktion ist, die ausgeführt wird, nachdem das Versprechen abgelehnt wurde, während " Werfen" nicht asynchron verwendet werden kann. Wenn Sie die Option "Zurückweisen" gewählt haben, wird Ihr Code weiterhin normal asynchron ausgeführt, während " throw" die Ausführung der Resolver-Funktion priorisiert (diese Funktion wird sofort ausgeführt).

Ein Beispiel, das mir bei der Klärung des Problems geholfen hat, war, dass Sie eine Timeout-Funktion mit Ablehnen festlegen können, zum Beispiel:

new Promise(_, reject) {
 setTimeout(reject, 3000);
});

Das obige könnte nicht mit Wurf geschrieben werden.

In Ihrem kleinen Beispiel ist der Unterschied nicht zu unterscheiden, aber wenn Sie sich mit einem komplizierteren asynchronen Konzept befassen, kann der Unterschied zwischen beiden drastisch sein.

TLDR: Eine Funktion ist schwer zu verwenden, wenn sie manchmal ein Versprechen zurückgibt und manchmal eine Ausnahme auslöst . Ziehen Sie es vor, beim Schreiben einer asynchronen Funktion einen Fehler zu melden, indem Sie ein abgelehntes Versprechen zurückgeben

Ihr spezielles Beispiel verschleiert einige wichtige Unterschiede zwischen ihnen:

Da Sie die Fehlerbehandlung sind innerhalb eines Versprechens Kette, erhalten geworfen Ausnahmen automatisch umgewandelt abgelehnt Versprechen. Dies mag erklären, warum sie austauschbar zu sein scheinen - sie sind es nicht.

Betrachten Sie die folgende Situation:

checkCredentials = () => {
    let idToken = localStorage.getItem('some token');
    if ( idToken ) {
      return fetch(`https://someValidateEndpoint`, {
        headers: {
          Authorization: `Bearer ${idToken}`
        }
      })
    } else {
      throw new Error('No Token Found In Local Storage')
    }
  }

Dies wäre ein Anti-Pattern, da Sie dann sowohl asynchrone als auch Synchronisierungsfehlerfälle unterstützen müssten. Es könnte ungefähr so ​​aussehen:

try {
  function onFulfilled() { ... do the rest of your logic }
  function onRejected() { // handle async failure - like network timeout }
  checkCredentials(x).then(onFulfilled, onRejected);
} catch (e) {
  // Error('No Token Found In Local Storage')
  // handle synchronous failure
} 

Nicht gut und genau hier kommt Promise.reject(im globalen Bereich verfügbar) zur Rettung und unterscheidet sich effektiv von throw. Der Refaktor wird nun:

checkCredentials = () => {
  let idToken = localStorage.getItem('some_token');
  if (!idToken) {
    return Promise.reject('No Token Found In Local Storage')
  }
  return fetch(`https://someValidateEndpoint`, {
    headers: {
      Authorization: `Bearer ${idToken}`
    }
  })
}

Auf diese Weise können Sie jetzt nur eine catch()für Netzwerkfehler und die synchrone Fehlerprüfung auf fehlende Token verwenden:

checkCredentials()
      .catch((error) => if ( error == 'No Token' ) {
      // do no token modal
      } else if ( error === 400 ) {
      // do not authorized modal. etc.
      }

Ein Beispiel zum Ausprobieren. Ändern Sie einfach isVersionThrow in false, um Reject anstelle von Throw zu verwenden.

const isVersionThrow = true

class TestClass {
  async testFunction () {
    if (isVersionThrow) {
      console.log('Throw version')
      throw new Error('Fail!')
    } else {
      console.log('Reject version')
      return new Promise((resolve, reject) => {
        reject(new Error('Fail!'))
      })
    }
  }
}

const test = async () => {
  const test = new TestClass()
  try {
    var response = await test.testFunction()
    return response 
  } catch (error) {
    console.log('ERROR RETURNED')
    throw error 
  }  
}

test()
.then(result => {
  console.log('result: ' + result)
})
.catch(error => {
  console.log('error: ' + error)
})