一、JavaScript遇到错误
当 JavaScript 引擎执行 JavaScript 代码时，会发生各种错误。
- 可能是语法错误，通常是程序员造成的编码错误或错别字。
- 可能是拼写错误或语言中缺少的功能（可能由于浏览器差异）。
- 可能是由于来自服务器或用户的错误输出而导致的错误。
- 可能是由于许多其他不可预知的因素。
二、JavaScript抛出错误
当错误发生时，当事情出问题时，JavaScript 引擎通常会停止执行，并抛出一个错误消息。
使用 throw语句也可以创建自定义消息(抛出异常)，下文会介绍到throw语句的用法。
三、try...catch...finally结构
try/catch/finally 语句用于处理代码中可能出现的错误信息。
【1】定义和用法
try语句：定义在执行时进行错误测试的代码块。
catch语句：定义当 try 代码块发生错误时，所执行的代码块。
finally语句：在 try 和 catch 之后，无论try和catch结果有无异常都会执行。
注意： catch 和 finally 语句都是可选的，但你在使用 try 语句时必须至少使用其中一个。
1、 事情还有得挽回， 换条路走
try {
// 执行某个逻辑,没出错，则按流程正常执行
} catch (err) {
//出问题了， 换个逻辑执行
} finally {
// 可选，无论try/catch结果如何都会执行的代码块
}
2、 体面的退出
try {
// 执行某个逻辑,没出错，则按流程正常执行
} catch (err) {
// 出问题了，弹个框告诉用户出错了，终止执行
// err参数就是抛出的错误信息
} finally {
// 可选，无论try/catch结果如何都会执行的代码块
}
【2】案例
try {
let params = {
page: 1,
size: 10
}
let queryResult = await getOfferSheet(params);
this.$alert('操作成功');
} catch (err) {
this.$alert(err);
}
// 如上案例是通过调用一个api接口，处理成功返回200，则弹出操作成功，如果报错，则跳到catch代码块弹出错误信息框提示用户出问题了
四、throw 语句
throw 语句允许我们创建自定义错误。throw 语句的作用是手动中断程序执行，创建并抛出一个异常，异常可以是 JavaScript 字符串、数字、逻辑值或对象。
【1】语法
// 抛出一个字符串
throw 'Error！'; // Uncaught Error！
// 抛出一个数值
throw 404; // Uncaught 404
// 抛出一个布尔值
throw true; // Uncaught true
// 抛出一个对象
throw {
toString: function () {
return 'Error!';
}
}; // Uncaught {toString: ƒ}
【2】案例
if (x < 0) {
throw new Error('x必须为正数'); // 或者换成 throw 'x必须为正数'
}
// 上面代码中，如果变量x小于0，就手动抛出一个错误，告诉用户x的值不正确，整个程序就会在这里中断执行。可以看到，throw抛出的错误就是它的参数'x必须为正数'
五、注意
如果把 throw 与 try 和 catch 一起使用，那么您能够控制程序流，并生成自定义的错误消息。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
</style>
</head>
<body>
<p>请输出一个 1 到 10 之间的数字:</p>
<input id="demo" type="text">
<button type="button" onclick="myFunction()">测试输入</button>
<p id="message"></p>
<script>
function myFunction() {
var message, x;
message = document.getElementById("message");
message.innerHTML = "";
x = document.getElementById("demo").value;
try {
if (x == "") throw "值为空";
if (isNaN(x)) throw "不是数字";
x = Number(x);
if (x < 1) throw "太小";
if (x > 10) throw "太大";
} catch (err) {
message.innerHTML = "错误: " + err;
}
}
</script>
</body>
</html>
网友评论