Analysons ensemble les méthodes de gestion des exceptions JavaScript

Cet article vous apporte des connaissances pertinentes sur JavaScript, qui présentent principalement des problèmes liés à la gestion des exceptions. Certaines erreurs se produiront inévitablement lors du processus d'écriture de programmes, nous pouvons apprendre comment éviter de rencontrer de telles situations et comment procéder. mieux la prochaine fois. Jetons-y un coup d'œil, j'espère que cela sera utile à tout le monde.

【Recommandations associées : Tutoriel vidéo javascript, front-end web】

Les erreurs font partie du processus de programmation. Il y aura inévitablement des erreurs dans le processus d'écriture des programmes. Grâce à ces erreurs, nous pouvons apprendre comment éviter de telles situations et comment faire mieux la prochaine fois.

En JavaScript, lorsque les instructions de code sont étroitement couplées et génèrent des erreurs, cela n'a aucun sens de continuer à utiliser les instructions de code restantes. Au lieu de cela, nous essayons de nous remettre des erreurs avec autant de grâce que possible. L'interpréteur JavaScript vérifie le code de gestion des exceptions lorsqu'une telle erreur se produit, et s'il n'y a pas de gestionnaire d'exceptions, le programme revient à la fonction à l'origine de l'erreur.

Répétez cette opération pour chaque fonction de la pile d'appels jusqu'à ce qu'un gestionnaire d'exceptions soit trouvé ou que la fonction de niveau supérieur soit atteinte, provoquant la fin du programme avec une erreur, provoquant son crash.

De manière générale, il existe deux façons de résoudre ce problème :

• Lancer une exception — Si un problème survient au moment de l'exécution et ne peut pas être traité de manière significative, il est préférable de le lancer

function openFile(fileName) {
  if (!exists(fileName)) {
    throw new Error('找不到文件 ' + fileName)
  }
  // ...
}

• Catching Exceptions — Les exceptions levées sont interceptées et gérées au moment de l'exécution, là où cela a plus de sens

try {
  openFile('../test.js')
} catch(e) {
  // 优雅地处理抛出的期望
}

Examinons ces opérations plus en détail.

Exception levée

Vous pouvez voir quelque chose comme ReferenceError : les spécifications ne sont pas définies. Cela représente une exception levée via une instruction throw.

Syntaxe

throw «value»
// 不要这样做
if (somethingBadHappened) {
  throw 'Something bad happened'
}

Il n'y a aucune restriction sur les types de données qui peuvent être générés en tant qu'exceptions, mais JavaScript a des types d'exception intégrés spéciaux. L’un d’eux est Error, comme vous l’avez vu dans l’exemple précédent. Ces types d'exceptions intégrés nous fournissent plus de détails que le message d'exception.

Erreur

Le type d'erreur est utilisé pour représenter des exceptions générales. Ce type d'exception est le plus souvent utilisé pour implémenter des exceptions définies par l'utilisateur. Il dispose de deux propriétés intégrées disponibles.

• message — Le contenu passé en paramètre au constructeur Error. Par exemple, new Error('Ceci est un message d'erreur'). Vous pouvez accéder au message via la propriété message.

const myError = new Error('Error!!!')
console.log(myError.message) // Error!!!

• stack — Cette propriété renvoie l'historique (pile d'appels) du fichier qui a provoqué l'erreur. Le haut de la pile comprend également le message, suivi de la pile réelle, en commençant par le point d'erreur le plus récent/isolé jusqu'au fichier responsable le plus externe.

Error: Error!!!
    at <anonymous>:1:1

Remarque : new Error('...') n'effectuera aucune opération avant le lancement, c'est-à-dire que throw new Error('error msg') créera une instance d'erreur en JavaScript et arrêtera l'exécution du script , à moins que vous ne fassiez quelque chose avec l'erreur, comme l'attraper.

Attraper les exceptions

Maintenant que nous savons ce que sont les exceptions et comment les lancer, discutons de la manière de les empêcher de briser notre programme en les attrapant.

try-catch-finally est le moyen le plus simple de gérer les exceptions.

try {
  // 要运行的代码
} catch (e) {
  // 发生异常时要运行的代码
}
  
[ // 可选
  finally {
    // 无论发生异常都始终执行的代码
  }
]

Dans la clause try, nous ajoutons du code qui peut générer une exception. Si une exception se produit, la clause catch est exécutée.

Parfois, le code doit être exécuté, que le code génère ou non une exception. Dans ce cas, nous pouvons utiliser le bloc facultatif enfin.

Même si la clause try ou catch exécute l'instruction return, le bloc final s'exécutera. Par exemple, la fonction suivante renvoie « Exécuter finalement » car la clause enfin est la dernière chose exécutée.

function foo() {
  try {
    return true
  } finally {
    console.log('Execute finally')
  }
}

Nous utilisons try-catch où l'exactitude du code ne peut pas être vérifiée au préalable.

const user = '{"name": "D.O", "age": 18}'
try {
  // 代码运行
  JSON.parse(params)
  // 在出现错误的情况下，其余的代码将永远无法运行
  console.log(params)
} catch (err) {
  // 在异常情况下运行的代码
  console.log(err.message) // params is not defined
}

Comme indiqué ci-dessus, il n'est pas possible de vérifier JSON.parse pour obtenir un objet ou une chaîne stringify avant d'exécuter le code.

Remarque : vous pouvez détecter les exceptions générées par le programme et les exceptions d'exécution, mais vous ne pouvez pas détecter les erreurs de syntaxe JavaScript.

try-catch-finally ne peut détecter que les erreurs de synchronisation. Si nous essayons de l'utiliser avec du code asynchrone, try-catch-finally peut s'être exécuté avant que le code asynchrone termine son exécution.

Comment gérer les exceptions dans les blocs de code asynchrones

Fonctions de rappel

En utilisant les fonctions de rappel (non recommandées), nous recevons généralement deux paramètres comme indiqué ci-dessous :

async function(code, (err, result) => {
  if (err) return console.error(err)
  console.log(result)
})

Nous pouvons voir qu'il y a deux paramètres : err et résultat. S'il y a une erreur, le paramètre err sera égal à l'erreur et nous pourrons le lancer pour la gestion des exceptions.

在 if (err) 块中返回某些内容或将其他指令包装在 else 块中都很重要。否则，您可能会遇到另一个错误。例如，当您尝试访问 result.data 时，result 可能未定义。

Promises

使用 promises 的 then 或者 catch，我们可以通过将错误处理程序传递给 then 方法或使用 catch 子句来处理错误。

promise.then(onFulfilled, onRejected)

也可以使用 .catch(onRejected) 而不是 .then(null, onRejected) 添加错误处理程序，其工作方式相同。

让我们看一个 .catch 拒绝 Promise 的例子。

Promise.resolve('1')
  .then(res => {
    console.log(res) // 1
    throw new Error('go wrong') // 抛出异常
})
.then(res => {
  console.log(res) // 不会被执行
})
.catch(err => { 
  console.error(err) // 捕获并处理异常 ——> Error: go wrong
})

使用 async/await 和 try-catch

使用 async/await 和 try-catch-finally，处理异常是轻而易举的事。

async function func() {
  try {
    await nonExistentFunction()
  } catch (err) {
    console.error(err) // ReferenceError: nonExistentFunction is not defined 
  }
}

如何处理未捕获的异常

现在我们已经很好地理解了如何在同步和异步代码块中执行异常处理，让我们回答本文最后一个待解决的问题 ：我们如何处理未捕获的异常？

在浏览器中

我们可以使用 window.onerror() 方法来处理未捕获的异常。每当运行时发生错误时，该方法会在 window 对象上触发 error 事件。

onerror() 的另一个实用做法是：当站点中的图片或视频等数据加载出错时，可以用该方法触发某些操作。例如，提供一张加载出错时的图片，或显示一条消息。

<img src="logo.png" onerror="alert(&#39;Error loading picture.&#39;)" />

在 Node.js 中

EventEmitter 模块派生的 process 对象可以订阅事件 uncaughtException。

process.on('uncaughtException', () => {})`

我们可以传递一个回调来处理异常。如果我们尝试捕获这个未捕获的异常，进程将不会终止，因此我们必须手动完成。

uncaughtException 仅适用于同步代码。对于异步代码，还有另一个称为 unhandledRejection 的事件。

process.on('unhandledRejection', () => {})

决不要尝试为基本 Error 类型实现 “捕获所有” 处理程序。这将混淆所发生的一切，并损害代码的可维护性和可扩展性。

关键要点

throw 语句用于生成用户定义的异常。在运行时，当 throw 遇到语句时，当前函数的执行将停止，控制权将传递给 catch 调用堆栈中的第一个子句。如果没有 catch 子句，程序将终止

JavaScript 有一些内置的异常类型，最值得注意的是 Error，它返回 Error 中的两个重要属性：stack 和 message。

try 子句将包含可能产生异常的代码，catch 子句会在发生异常时执行。

对于异步代码，最好使用 async/await 配合 try-catch 语句。

可以捕获未处理的异常，这可以防止应用程序崩溃。

不要觉得麻烦，异常处理可以帮助您提高代码的可维护性、可扩展性和可读性。

【相关推荐：javascript视频教程、web前端】

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!