javascript错误处理与调试

视频课堂https://edu.csdn.net/course/play/7621

在程序开发中难免会遇到一些错误，在成千上万的代码中去寻找错误很明显相当于大海捞针，为此，每种计算机编程语言都要它独特的一套错误处理与调试机制。当然，JavaScript也不例外。

发生错误：

执行代码时发生的错误有很多。每种错误都有对应的错误类型。ECMA-262定义了7种错误类型：

1.Error 错误

2.EvalError 全局错误

3.RangeError 引用错误

4.ReferenceError 参数错误

5.SyntaxError 语法错误

6.TypeError 类型错误

7.URIError 编码错误

其中Error是基类型，其他类型继承自它。Error类型很少见，一般由浏览器抛出。EvalError类型表示全局函数eval()的使用方式与定义不同时抛出，但实际上并不能产生这个错误，所以实际上碰到的可能性不大。在使用encodeURI()和decodeURI()时，如果URI格式不正确时，会导致URIError错误。但因为URI的兼容性非常强，导致这种错误几乎见不到。

处理错误：

浏览器自身具有报错的功能。以IE为例，出错时会弹出错误调试框。但这需要开启脚本调试，设置方法为：工具->Internet Options选项->高级->禁用脚本调试，取消勾选即可。其它浏览器大同小异。

良好的错误处理机制可以及时提醒用户，知道发生了什么，而不会惊慌失措，为此，作为开发人员，必须理解在处理JavaScript错误的时候，都有哪些手段和工具可以利用。

try-catch语句。

例子：

[javascript] view plain copy

try { //尝试着执行 try 包含的代码
window.abcdefg(); //不存在的方法
} catch (e) { //如果有错误，执行 catch，e 是异常对象
alert('发生错误啦，错误信息为：' + e); //直接打印调用 toString()方法
}

可以通过修改代码解决或浏览器兼容错误，不建议使用try-catch，因为它比一般语句消耗资源更多，负担更大。所以在万不得已，无法修改代码，不能通过普通判断的情况下才去使用try-catch。

finally子句

例子：

[javascript] view plain copy

try {
window.abcdefg();
} catch (e) {
alert('发生错误啦，错误信息为：' + e.stack);
} finally { //总是会被执行
alert('我都会执行！');
}

finally的作用一般是为了防止出现异常后，无法往下再执行的备用。

抛出错误

使用catch来处理错误信息，如果处理不了，我们就把它抛出丢掉。

例子：

[javascript] view plain copy

try {

[javascript] view plain copy

new 10;
} catch (e) {
if (e instanceof TypeError) {
throw new TypeError('实例化的类型导致错误！'); //直接中文解释错误信息
} else {
<span style="white-space:pre"> </span>throw new Error('抛出未知错误！');
}
}

调试错误：

在JavaScript初期，浏览器并没有针对JavaScript提供调试工具，所以开发人员就想出了一套自己的调试方法，比如alert()。但使用alert()来调试错误比较麻烦，需要重复剪切和粘贴，如果遗忘掉没有删掉用于调试的alert()将特别头疼，现在我们有更好的调试方法。

将消息记录到控制台

例子：

1、

[javascript] view plain copy

console.error('错误！'); //红色带叉
console.info('信息！'); //白色带信息号
console.log('日志！'); //白色
console.warn('警告！'); //黄色带感叹号

2、

[javascript] view plain copy

var num1 = 1;
console.log(typeof num1); //得到 num1 的类型
var num2 = 'b';
console.log(typeof num2); //得到 num2 的类型
var result = num1 + num2;
alert(result); //结果是 1b，匪夷所思

与alert()的比较：因为alert()会阻断后面代码的执行，看过之后还要删，删完估计一会儿又忘了。如果用了congsole.log的话，所有要调试的变量一目了然，也不需要删除，放着也没事。

抛出错误

上面已有抛出错误的例子和讲解，这里不在赘述。

调试工具

浏览器都自带了自己的调试工具，而开发人员只习惯了Firefox一种，所以很多情况下，在Firefox开发调试，然后去其他浏览器做兼容。其实Firebug工具提供了一种Web版的调试工具：Firebug lite。

调试步骤

1、设置断点

2、单步调试：五个按钮

重新运行：重新单步调试

断继：正常执行代码

单步进入：一步一步执行流程

单步跳过：跳到下一个函数块

单步退出：跳出执行到内部的函数

3、监控

4、控制台

小结：

错误处理与调试在之前VB,C++,C#,VB.NET中都有一定的学习和了解。但知识点却很分散。在JavaScript中对其有了一个宏观和细节上全面的把控，对其有了更深的印象。知识是要一遍遍学习的，从陌生到熟悉再到精通，是一个循序渐进的过程。错误处理与调试机制学习了这么久，再往后就可以灵活地将它应用于各个项目和系统。

javascript错误处理与调试相关推荐

javascript错误处理与调试（转）
JavaScript 在错误处理调试上一直是它的软肋,如果脚本出错,给出的提示经常也让人摸不着头脑. ECMAScript 第 3 版为了解决这个问题引入了 try...catch 和 throw 语 ...
javascript 错误与调试
1.JavaScript 错误 - throw.try 和 catch try 语句测试代码块的错误. catch 语句处理错误. throw 语句创建自定义错误. 1.1 JavaScript 错误 ...
【转】调试JavaScript 错误的解决方案
A 使用alert() 和document.write() 方法监视变量值如果要中断代码的运行,监视变量的值,则使用alert() 方法: 如果需要查看的值很多,则使用document.write ...
JavaScript(第二十七天)【错误处理与调试】
JavaScript在错误处理调试上一直是它的软肋,如果脚本出错,给出的提示经常也让人摸不着头脑.ECMAScript第3版为了解决这个问题引入了try...catch和throw语句以及一些错误类型 ...
IE调试网页之五：使用 F12 开发人员工具调试 JavaScript 错误 (Windows)
使用 F12 开发人员工具,Web 开发人员能够在无需离开浏览器的情况下快速调试 JavaScript 代码. 通过内置到每个 Windows Internet Explorer 9 安装中,F12 ...
《JavaScript高级程序设计》学习笔记——错误处理与调试
Author:chemandy 第十四章错误处理与调试 1.开启浏览器错误报告 1.1 Internet Explorer □Toos → Internet Option → Anvanced → ...
17. javacript高级程序设计-错误处理与调试
1. 错误处理与调试 l 在可能发生错误的地方使用try-catch方法,可以对错误进行及时的相应 l 使用window.onerror事件处理程序,这种方式可以接受try-catch不能处理的所有错 ...
javascript演变史_检查有史以来最著名JavaScript错误之一
javascript演变史 by aiswarya krishna 通过aiswarya克里希纳检查有史以来最著名JavaScript错误之一. (Inspecting one of the mos ...
Visual Studio 2013中因SignalR的Browser Link引起的Javascript错误一则
众所周知Visual Studio 2013中有一个由SignalR机制实现的Browser Link功能,意思是开发人员可以同时使用多个浏览器进行调试,当按下IDE中的Browser Link按钮后 ...

javascript错误处理与调试

javascript错误处理与调试相关推荐

最新文章

热门文章