Обещания JavaScript - отклонить против броска

Я прочитал несколько статей на эту тему, но мне все еще не ясно, есть ли разница между Promise.rejectвыдачей ошибки. Например,

Использование Promise.reject

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

Используя бросок

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

Я предпочитаю использовать throwпросто потому, что он короче, но мне было интересно, есть ли преимущество одного над другим.

Нет преимущества в использовании одного против другого, но есть особый случай, когда throwон не будет работать. Тем не менее, эти случаи могут быть исправлены.

Каждый раз, когда вы находитесь внутри обещания обратного вызова, вы можете использовать throw. Однако, если вы находитесь в любом другом асинхронном обратном вызове, вы должны использовать reject.

Например, это не сработает:

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
});

Вместо этого вы остаетесь с нерешенным обещанием и необдуманным исключением. Это тот случай, когда вы хотите использовать вместо этого reject. Однако это можно исправить двумя способами.

1. используя функцию отклонения исходного Promise в течение тайм-аута:

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

2. обещая тайм-аут:

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!'
});

Другим важным фактом является то, что reject() НЕ завершает поток управления, как returnоператор. В отличие от throwэтого прекращается контроль потока.

Пример:

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

против

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"));

Да, самое большое отличие в том, что reject - это функция обратного вызова, которая выполняется после того, как обещание отклонено, тогда как throw не может использоваться асинхронно. Если вы решили использовать отклонение, ваш код продолжит работать в обычном асинхронном режиме, в то время как throw будет определять приоритет завершения функции распознавателя (эта функция будет запущена немедленно).

Пример, который я видел, который помог мне прояснить проблему, состоял в том, что вы можете установить функцию Timeout с помощью reject, например:

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

Выше не могло бы быть возможно написать с броском.

В вашем небольшом примере разница в неразличимости, но при работе с более сложной асинхронной концепцией разница между ними может быть радикальной.

TLDR: функцию трудно использовать, когда она иногда возвращает обещание, а иногда выдает исключение. При написании асинхронной функции предпочитайте сигнализировать об ошибке, возвращая отклоненное обещание

Ваш конкретный пример запутывает некоторые важные различия между ними:

Поскольку вы обрабатываете ошибки внутри цепочки обещаний, сгенерированные исключения автоматически преобразуются в отклоненные обещания. Это может объяснить, почему они кажутся взаимозаменяемыми - это не так.

Рассмотрим ситуацию ниже:

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')
    }
  }

Это будет анти-паттерном, потому что вам нужно будет поддерживать как асинхронные, так и синхронизирующие ошибки. Это может выглядеть примерно так:

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
} 

Не хорошо, и именно здесь Promise.reject(доступно в глобальном масштабе) приходит на помощь и эффективно дифференцируется от throw. Рефактор теперь становится:

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}`
    }
  })
}

Теперь это позволяет вам использовать только один catch()для сетевых сбоев и синхронную проверку ошибок на отсутствие токенов:

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

Пример, чтобы попробовать. Просто измените isVersionThrow на false, чтобы использовать reject вместо throw.

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)
})