JavaScript错误处理

时间:2023-03-08 21:25:29
JavaScript错误处理

JavaScript 错误 - Throw、Try 和 Catch

JavaScript 测试和捕捉

try 语句允许我们定义在执行时进行错误测试的代码块。

catch 语句允许我们定义当 try 代码块发生错误时,所执行的代码块。

JavaScript 语句 trycatch 是成对出现的。

语法

try
{
//在这里运行代码
}
catch(err)
{
//在这里处理错误
}

实例

在下面的例子中,我们故意在 try 块的代码中写了一个错字。

catch 块会捕捉到 try 块中的错误,并执行代码来处理它。

<!DOCTYPE html>
<html>
<head>
<script>
var txt="";
function message()
{
try
{
adddlert("Welcome guest!");
}
catch(err)
{
txt="There was an error on this page.\n\n";
txt+="Error description: " + err.message + "\n\n";
txt+="Click OK to continue.\n\n";
alert(txt);
}
}
</script>
</head> <body>
<input type="button" value="View message" onclick="message()">
</body> </html>

Throw 语句

throw 语句允许我们创建自定义错误。

正确的技术术语是:创建或抛出异常(exception)。

如果把 throw 与 try 和 catch 一起使用,那么您能够控制程序流,并生成自定义的错误消息。

语法

throw exception

异常可以是 JavaScript 字符串、数字、逻辑值或对象。

实例

本例检测输入变量的值。如果值是错误的,会抛出一个异常(错误)。catch 会捕捉到这个错误,并显示一段自定义的错误消息:

<script>
function myFunction()
{
try
{
var x=document.getElementById("demo").value;
if(x=="") throw "empty";
if(isNaN(x)) throw "not a number";
if(x>10) throw "too high";
if(x<5) throw "too low";
}
catch(err)
{
var y=document.getElementById("mess");
y.innerHTML="Error: " + err + ".";
}
}
</script> <h1>My First JavaScript</h1>
<p>Please input a number between 5 and 10:</p>
<input id="demo" type="text">
<button type="button" onclick="myFunction()">Test Input</button>
<p id="mess"></p>

javascript Error 对象 错误处理

javascript常见error对象处理,错误代码集合

Error对象

Property:
  name: 错误名
  number: 错误号
  description: 描述
  message: 错误信息,多同description
 FF Only 属性
  fileName: 错误发生的文件
  stack: 错误发生时的调用堆栈

Constructor:
  Error(){
    this(0,"")}
  Error(description){
    this(0,description)}
  Error(number,description){
    ....}

构造函数参数不带name,是因为Error对象的name对应于它的来源:
  EvalError: 错误发生在eval()中
  SyntaxError: 语法错误,错误发生在eval()中,因为其它点发生SyntaxError会无法通过解释器
  RangeError: 数值超出范围
  ReferenceError: 引用不可用
  TypeError: 变量类型不是预期的
  URIError: 错误发生在encodeURI()或decodeURI()中

抛出Error:
  throw new Error(0,"Error Demo");
  new Error可省略:
    throw("Error Demo");

捕获Error:
  try catch finally语句:
    try{
      ..可能错误的语句..}
    catch(e){
       ..错误发生后的处理..}
    finally{
       ..完成后执行的语句块..}
   finally不是必须的
   如果嵌套,两个catch不要使用同一个参数名,以免覆盖
   传入的参数是一个Error对象,可以从中得到错误信息
   FF支持一个try多个catch,因为Js为弱类型不推荐使用

window.onerror错误捕获:
    window.onerror=function(Msg,Url,Num){}
    onerror事件会传给回调函数3个默认参数
      Msg: 错误信息
      Url: 发生错误的文件的Url
      Num: 错误发生位置的行号
    window.onerror还能处理SyntaxError,比try catch更强大。
    但是onerror属于bom,所以各浏览器厂家对其的支持都不同。
    如IE发生error时,正常的代码会继续执行;在FF中,代码将结束;Safari只支持Image的onerror事件处理。

Image.onerror
    onerror还可以应用于其它HTMLElement上,最常见的是<img />元素
    <img src="sample.jpg" onerror="javascript:alert('图像载入错误');" />

处理Error:
  判断错误类型:
    catch(e){
      if(e.name=="RangeError")
        alert("错误提示");}
    或
    catch(e){
      if(e instanceof TypeError)
        alert("错误提示");}

jQuery 事件 - error() 方法

定义和用法

当元素遇到错误(没有正确载入)时,发生 error 事件。

error() 方法触发 error 事件,或规定当发生 error 事件时运行的函数。

提示:该方法是 bind('error', handler) 的简写方式。

触发 error 事件

语法

$(selector).error()

将函数绑定到 error 事件

语法

$(selector).error(function)

实例

<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("img").error(function(){
$("img").replaceWith("<p><b>图片未加载!</b></p>");
});
});
</script>
</head>
<body>
<img src="errorimg.gif" />
<p>如果上面的图像没有正确地加载,会被替换为一段 "图片未加载" 的文本。</p>
</body>
</html>