Error handling in Javascript promises(throwing errors)

Question

I would like to do some error handling on the response received from a call I am making and then move to the catch if the specific null check is hit. Something like this:

    fetch('example.json')
        .then(response => {
            if (response.data === null) {
                //go to catch
            }
        })
        .catch(error => {
            console.error("error happened", error);
        })

What would be the best way to go about doing something like this? Any red flags with throwing an error inside a then block?

Answer 1

If you throw in a promise handler, that rejects the promise the handler returns. So:

fetch('example.json')
    .then(response => {
        if (response.data === null) {
            throw new Error();
        }
    })
    .catch(error => {
        console.error("error happened", error);
    })

What you throw will be the rejection reason the catch handler sees. It doesn't have to be an Error , but as with synchronous code, it's generally best if it is.

But , note that A) A fetch response doesn't have a data property, and B) You need to check for HTTP success and parse the JSON that was returned.

You probably want something like this:

fetch('example.json')
    .then(response => {
        if (!response.ok) {
            // (I tend to use an specialized `Error` type here
            // More on my anemic blog:
            // http://blog.niftysnippets.org/2018/06/common-fetch-errors.html)
            throw new Error("HTTP error " + response.status);
        }
        return response.json();
    })
    .then(data => {
        if (data === null) {
            throw new Error("The data is null");
        })
        // ...do something with `data`...
    })
    .catch(error => {
        console.error("error happened", error);
    });

---

In a comment on the question you've said:

i was hoping there was a way to check this response object without having to trigger the 'extreme' measure of throwing an exception

You do have an alternative which is basically identical in outcome: Return a rejected promise. Here's my second code block above adapted to do that:

fetch('example.json')
    .then(response => {
        if (!response.ok) {
            // (I tend to use an specialized `Error` type here
            // More on my anemic blog:
            // http://blog.niftysnippets.org/2018/06/common-fetch-errors.html)
            return Promise.reject(new Error("HTTP error " + response.status));
        }
        return response.json();
    })
    .then(data => {
        if (data === null) {
            return Promise.reject(new Error("The data is null"));
        })
        // ...do something with `data`...
    })
    .catch(error => {
        console.error("error happened", error);
    });

And as with the throw version, you don't have to use an Error , it's just best practice. It can be anything you want.

Answer 2

If you want, you can throw an Error object from within your promise handler.

fetch('example.json')
  .then(response => {
    if (response.data === null) {
      throw new Error('oopsie');
    }
  })
  .catch(error => {
    console.error("error happened", error); // will show "Error: oopsie"
  })