资讯专栏INFORMATION COLUMN

高程3总结#第17章错误处理与调试

fizz / 883人阅读

错误处理与调试 错误处理 try-catch语句
try{
  //可能会导致错误的代码
}catch(error){
  //在错误发生时怎么处理
}

发生错误时可以显示浏览器给出的信息

try{
  window.someNonexistentFunction();
}catch(error){
  alert(error.message);
}

在try-catch语句中是可选的,但finally子句一经使用,代码无论如何都会执行,try语句块中的代码全部正常执行,finally子句会执行,如果因为出错而执行了catch语句块,finally子句照样还会执行。只要代码中包含finally子句,无论try或catch语句块中包含什么代码,甚至return语句,都不会阻止finally子句的执行

function testFinally(){
  try{
    return 2;
  }catch(error){
    return 1;
  }finally {
    return 0;
  }
}

ECMA-262定义了7种错误类型

Error,是基类型,其他错误类型都继承自该类型

EvalError,错误会在使用eval()函数而发生异常时被抛出

new eval();//抛出EvalError
eval=foo;//抛出EvalError

RangeError,在数值超出相应范围时触发

var items1=new Array(-20);//抛出RangeError
var items2=new Array(Number.MAX_VALUE);//抛出RangeError

ReferenceError,找不到对象时,抛出这个错误

var obj=x;//在x并未声明的情况下抛出ReferenceError

SyntaxError,把语法错误的JavaScript传入eval()函数时触发

eval("a++b");//抛出SyntaxError

TypeError,在变量中保存着意外的类型,或者访问不存在的方式时触发

var o=new 10;//抛出TypeError
alert("name" in true);//抛出TypeError
Function.prototype.toString.call("name");//抛出TypeError

URIError,使用encodeURI()或decodeURI()而URI格式不正确时触发

抛出错误

与try-catch语句相配的还有一个throw操作符,用于随时抛出自定义错误。抛出错误时,必须要给throw操作符指定一个值,这个值是什么类型。没有要求

throw 12345;
throw "Hello world!";
throw true;
throw {name:"JavaScript"};

也可以模拟出类似的浏览器错误

throw new SyntaxError("I don’t like your syntax.");
throw new TypeError("What type of variable do you take me for?");
throw new RangeError("Sorry, you just don’t have the range.");
throw new EvalError("That doesn’t evaluate.");
throw new URIError("Uri, is that you?");
throw new ReferenceError("You didn’t cite your references properly.");

抛出错误的时机

//函数会在参数不是数组的情况下失败
function process(values){
  value.sort();
  for(var i=0,len=values.length;i100){
      return values[i];
    }
  }
  return -1;
}

以上代码,不同浏览器给出不同错误信息

IE,属性或方法不存在

Firefox,values.sort()不是函数

Safari,值undefined

Chrome,对象名没有方法sort

Opera,类型不匹配

//函数重写
function process(values){
  if (!(values instanceof Array)){
    throw new Error("process(): Argument must be an array.");
  }
  values.sort();
  for (var i=0, len=values.length; i < len; i++){
    if (values[i] > 100){
      return values[i];
    }
  }
  return -1;
}

重写后的函数中,如果values参数不是数组,就会抛出一个错误,错误消息中包含了函数的名称,以及为什么会发生错误的明确描述

错误(error)事件

任何没有通过try-catch处理的错误都会触发window对象的error事件

在任何Web浏览器中,onerror事件处理程序都不会创建event对象,但可以接收三个参数:错误消息,错误所在的URL和行号

只要发生错误,无论是不是浏览器生成的,都会触发error事件,并执行这个事件处理程序

在事件处理程序中返回false可以阻止浏览器报告错误的默认行为

window.onerror=function(message,url,line){
  alert(message);
  return false;
}

常见错误类型

一般需要关注三种错误

类型转换错误

数据类型错误

通信错误

区分致命错误和非致命错误

非致命错误

不影响用户的主要任务

只影响页面的一部分

可以恢复

重复相同的操作可以消除错误

致命错误

应用程序根本无法继续运行

错误明显影响到了用户的主要操作

会导致其他连带错误

把错误记录到服务器
for(var i=0,len=mods.length;i
调试技术
将消息记录到控制台

可以通过console对象向JavaScript控制台中写入信息,这个对象具有下列方法

error(message),将错误信息记录到控制台

info(message),将信息性消息记录到控制台

log(message),将一般消息记录到控制台

warn(message),将警告消息记录到控制台

function sum(num1, num2){
  console.log("Entering sum(), arguments are " + num1 + "," + num2);
  console.log("Before calculation");
  var result = num1 + num2;
  console.log("After calculation");
  console.log("Exiting sum()");
  return result;
}

将消息记录到当前页面

在页面 中开辟一小块区域,用以显示信息,这个区域通常是一个元素,而该元素可以总是出现在页面中,但仅用于调试目的,也可以是一个根据需要动态创建的元素

function log(message){
  var console = document.getElementById("debuginfo");
  if (console === null){
    console = document.createElement("div");
    console.id = "debuginfo";
    console.style.background = "#dedede";
    console.style.border = "1px solid silver";
    console.style.padding = "5px";
    console.style.width = "400px";
    console.style.position = "absolute";
    console.style.right = "0px";
    console.style.top = "0px";
    document.body.appendChild(console);
  }
  console.innerHTML += "

" + message + "

"; }

抛出错误

可以使用assert()函数代替某些函数中需要调试的if语句,以便输出错误消息

function assert(condition, message){
  if (!condition){
    throw new Error(message);
  }
}
function divide(num1, num2){
  assert(typeof num1 == "number" && typeof num2 == "number",
         "divide(): Both arguments must be numbers.");
  return num1 / num2;
}

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/97969.html

相关文章

  • 高程3总结#18JavaScriptXML

    摘要:在基于使用命名空间的文档求值时,需要使用对象。第四个参数的取值类型是下列常量之一,返回与表达式匹配的数据类型。,返回字符串值。这是最常用的结果类型。集合中节点的次序与它们在文档中的次序一致。 JavaScript与XML 浏览器对XML DOM的支持 DOM2级核心 在通过JavaScript处理XML时,通常只使用参数root,因为这个参数指定的是XML DOM文档元素的标签名 v...

    gaosboy 评论0 收藏0
  • 高程3总结#3基本概念

    摘要:基本概念语法区分大小写,中的一切变量函数名和操作符都区分大小写。要将一个值转换成对应的值,可以调用类型包括整数和浮点数值,基本数值字面量格式是十进制整数,除了十进制外还有八进制十六进制。八进制第一位必须是,十六进制第一位必须是。 基本概念 语法 区分大小写,ECMAScript中的一切(变量、函数名和操作符)都区分大小写。函数名不能使用typeof,因为它是一个关键字,但typeOf...

    Rindia 评论0 收藏0
  • 高程3总结#11DOM扩展

    摘要:操作类名时可以通过属性添加删除和替换类名。如果将可选的参数设置为,则表示尽量将元素显示在视口中部垂直方向。将元素的内容滚动指定的页面高度,具体高度由元素的高度决定。 DOM扩展 选择符API querySelector()方法 querySelector()方法接收一个CSS选择符,返回与该模式匹配的第一个元素,如果没有找到匹配的元素,返回null //取得body元素 var b...

    cucumber 评论0 收藏0
  • 高程3总结#24最佳实践

    摘要:也就是说避免属性查找或其他的操作。简化循环体循环体是执行最多的,所以要确保其被最大限度地优化。代码组织组织代码要考虑到可维护性并不一定是传送给浏览器的最好方式。 最佳实践 可维护性 什么是可维护性的代码 如果说代码是可维护的,它需要遵循以下特点 可理解性——其他人可以接手代码并理解它的意图和一般途径,而无需原开发人员的完整解释。 直观性——代码中的东西一看就能明白,不管其操作过程多...

    zhiwei 评论0 收藏0
  • 高程3总结#8BOM

    摘要:对象的核心对象是,它表示浏览器的一个实例。而和则表示该容器中页面视图区的大小。在中,与返回相同的值,即视口大小而非浏览器窗口大小。第三个参数是一个逗号分隔的设置字符串,表示在新窗口中都显示哪些特性。这应该是用户打开窗口后的第一个页面 BOM window对象 BOM的核心对象是window,它表示浏览器的一个实例。在浏览器中,window对象有双重角色,它既是通过JavaScript访...

    MASAILA 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<