JS错误处理与调试

错误类型：

执行代码时可能会发生的错误有很多种。每种错误都有对应的错误类型，ECMA-262定义了 7 种错误类型：
1.Error
2.EvalError
3.RangeError
4.ReferenceError
5.SyntaxError
6.TypeError
7.URIError

错误类型1：Error 

是基类型(其他六种类型的父类型)，其他类型继承自它。Error 类型很少见 ，一般由浏览器抛出的。这个基类型主要用于开发人员抛出自定义错误。

错误类型2:EvalError 

类型表示全局函数 eval()的使用方式与定义的不同时抛出，但实际上并不

能产生这个错误，所以实际上碰到的可能性不大。

错误类型3：RangeError(范围)

newArray(-5); //抛出 RangeError(范围)
错误信息为：RangeError: invalid array length（无效的数组的长度）
RangeError 错误一般在数值超出相应范围时触发RangeError

错误类型4：ReferenceError(引用)

var box = a; //抛出 ReferenceError(引用)
错误信息为：ReferenceError: a is not defined（a 是没有定义的）
ReferenceError 通常访问不存在的变量产生这种错误

错误类型5：SyntaxError(语法)

a $ b; //抛出 SyntaxError(语法)
错误信息为：SyntaxError: missing ; before statement（失踪;语句之前）
SyntaxError 通常是语法错误导致的

错误类型6：TypeError(类型 )

new 10; //抛出 TypeError(类型 )
错误信息为：TypeError: 10 is not a constructor（10 不是一个构造函数）
TypeError 通常是类型不匹配导致的

错误类型7：URIError（路径）

在使用 encodeURI()和 decodeURI()时，如果 URI 格式不正确时，会导致 URIError
错误。但因为 URI 的兼容性非常强，导致这种错误几乎见不到。
alert(encodeURI('千千'));

try - catch

try-catch特点
1.可以获取错误信息
2.可以避免浏览器控制台报错
3.可以屏蔽错误，继续执行，但是继续执行的语句如果和错误的语句有上下文关联,那么可能继续出错

try--catch 的意义
1.可以通过修改代码来排错的不需要使用
2.浏览器兼容性问题可以通过判断浏览器或者判断是否支持某个属性或方法来判断

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

在 e 对象中，ECMA-262 还规定了两个属性：message 和 name，分别打印出信息和名称。
alert('错误名称：' + e.name);
alert('错误名称：' + e.message);

finally 子句
finally 语句作为 try-catch 的可选语句，不管是否发生异常处理，都会执行。并且不管 try或是 catch 里包含 return 语句，也不会阻止 finally 执行。

finally 的作用一般是为了防止出现异常后，无法往下再执行的备用。也就是说，如果有一些清理操作，那么出现异常后，就执行不到清理操作，那么可以把这些清理操作放到finally 里即可

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

throw抛出错误

使用 catch 来处理错误信息，如果处理不了，我们就把它抛出丢掉。抛出错误，其实就是在浏览器显示一个错误信息，只不过，错误信息可以自定义，更加精确和具体。try {new 10;} catch (e) {if (e instanceof TypeError) {throw new TypeError('实例化的类型导致错误！'); //直接中文解释错误信息} else {throw new Error('抛出未知错误！');}}

错误处理策略：

常见的错误类型
因为 JavaScript 是松散弱类型语言，很多错误的产生是在运行期间的。一般来说，需要关注 3 种错误：
1.类型转换错误；2.数据类型错误；3.通信错误，这三种错误一般会在特定的模式下或
者没有对值进行充分检查的情况下发生。

1、类型转换错误

在一些判断比较的时候，比如数组比较，有相等和全等两种：
alert(1 == '1'); //true
alert(1 === '1'); //false
alert(1 == true); //true
alert(1 === true); //false 数值和类型全部相等
由于这个特性，我们建议在这种会类型转换的判断，强烈推荐使用全等，以保证
判断的正确性。

var box = 10; //可以试试 0if (box) { //10 自动转换为布尔值为 truealert(box);}

因为 0 会自动转换为 false，其实 0 也是数值，也是有值的，不应该认为是 false，
所以我们要判断 box 是不是数值再去打印。

var box = 0;if (typeof box == 'number') { //判断 box 是 number 类型即可alert(box);}

typeof box == 'number'这里也是用的相等，没有用全等呀？

原因是 typeof box 本身返回的就是类型的字符串，右边也是字符串，那没必要验证类型，所以相等就够了。

2、数据类型错误

由于 JavaScript 是弱类型语言，在使用变量和传递参数之前，不会对它们进行比较来确保数据类型的正确。所以，这样开发人员必须需要靠自己去检测。

function getQueryString(url) { //传递了非字符串，导致错误var pos = url.indexOf('?');return pos;}alert(getQueryString(1));

为了避免这种错误的出现，我们应该使用类型比较。

function getQueryString(url) {if (typeof url == 'string') { //判断了指定类型，就不会出错了var pos = url.indexOf('?');return pos;}}alert(getQueryString(1));

对于传递参数除了限制数字、字符串之外，我们对数组也要进行限制。

function sortArray(arr) {if (arr) { //只判断布尔值远远不够alert(arr.sort());}}var box = [3,5,1];sortArray(box);

只用 if (arr)判断布尔值，那么数值、字符串、对象等都会自动转换为 true，而这些
类型调用 sort()方法比如会产生错误，这里提一下：空数组会自动转换为 true 而非 false。

function sortArray(arr) {if (typeof arr.sort == 'function') { //判断传递过来 arr 是否有 sort 方法alert(arr.sort()); //就算这个绕过去了alert(arr.reverse()); //这个就又绕不过去了}}var box = { //创建一个自定义对象，添加 sort 方法sort : function () {}};sortArray(box);

这断代码本意是判断 arr 是否有 sort 方法，因为只有数组有 sort 方法，从而判断 arr是数组。但忘记了，自定义对象添加了 sort 方法就可以绕过这个判断，且 arr 还不是数组。

function sortArray(arr) {if (arr instanceofArray) { //使用 instanceof 判断是 Array 最为合适alert(arr.sort());}}var box = [3,5,1];sortArray(box);

3、通信错误

在使用 url 进行参数传递时，经常会传递一些中文名的参数或 URL 地址，在后台处理
时会发生转换乱码或错误，因为不同的浏览器对传递的参数解释是不同的，所以有必要使用
编码进行统一传递。
比如：

?user=千千&age=100var url = '?user=' + encodeURIComponent('千千') + '&age=100'; //编码