Оператор Catch не выполняется при возникновении ошибки

#javascript #reactjs #try-catch

#javascript #reactjs #попробуйте-catch

Вопрос:

У меня есть следующие операторы try / catch, но когда возникает ошибка, оператор catch ее не улавливает.

 try {
    navigator.serviceWorker.register('service-worker.js').then(sw => {
      sw.showNotification(`${this.state.selectedType.name} finished!`);
    });
  } catch (e) {
    console.log('Notification error', e);
  }

оператор ошибки

1. вам нужно поместить обработку ошибок в .catch promise. Как правило, try / catch и Promises плохо работают вместе — вот .catch для чего это нужно.

2. @RobinZigmond Цепочки Try / Catch и Promise могут работать вместе (без проблем), хотя обычно рекомендуется использовать один или другой шаблон и не смешивать их. Проблема здесь в том, что код является синхронным, поэтому он не await обещает разрешить или отклонить, поэтому, когда происходит отклонение, выполнение кода, вероятно, уже вернулось из этой функции.

3. использование try / catch с обещаниями обычно используется в сочетании с async / await — при использовании .then для обнаружения ошибок вы бы использовали .catch

Ответ №1:

Я исправил ваш код:

 navigator.serviceWorker.register('service-worker.js').then(sw => {
      sw.showNotification(`${this.state.selectedType.name} finished!`);
    }).catch(e => console.log(e))

Вы не можете использовать try{} и catch {} подобным образом при использовании axios, поскольку axios имеет свой собственный способ отслеживания ожиданий
Вам нужно использовать try{} и catch{} в асинхронном методе, если вы хотите сделать это другим способом, но этот способ должен работать сейчас с .then().catch()

1. Я получаю следующее сообщение об ошибке: Необработанное отклонение (TypeError): не удалось выполнить ‘showNotification’ в ‘ServiceWorkerRegistration’: для этого источника не было предоставлено разрешение на уведомление.

Ответ №2:

try/catch .then() В этом случае вы не можете использовать with , но вы можете использовать их с async/await .

Ваш код, использующий .then()

 navigator.serviceWorker.register('service-worker.js')
  .then((sw) => {
    sw.showNotification(`${this.state.selectedType.name} finished!`);
  })
  .catch((err) => console.log('Notification error', err);

И тот же код с использованием асинхронного ожидания (при условии, что этот код находится в async функции):

 try {
  const sw = await navigator.serviceWorker.register('service-worker.js');

  sw.showNotification(`${this.state.selectedType.name} finished!`);
} catch (err) {
  console.log('Notification error', e);
}