前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >错误处理与调试

错误处理与调试

作者头像
奋飛
发布2019-08-15 09:57:53
5790
发布2019-08-15 09:57:53
举报
文章被收录于专栏:Super 前端Super 前端

下述内存主要讲述了《JavaScript高级程序设计(第3版)》第17章关于“错误处理与调试”。

错误处理对于web应用程序开发而言至关重要。不能提前预测可能发生的错误,不能提前采取恢复策略,可能导致较差的用户体验,最终引发用户不满。多数浏览器在默认情况下不会向用户报告错误,因此在开发和调试期间需要启用浏览器的错误报告功能。然而,在投入运行的产品代码中,则不应该再有诸如此类的错误报告出现(例如alert)

一、错误处理

良好的错误处理机制可以让用户及时得到提醒,知道到底发生了什么事,因而不会惊慌失措。

1. try-catch语句
代码语言:javascript
复制
window.ligang();                    // Uncaught TypeError: window.ligang is not a function(…)
console.log("go on");               // 不再执行!!!
代码语言:javascript
复制
try {
    window.ligang();
}catch(error) {
    console.log(error.message);     // window.ligang is not a function
}
console.log("go on");               // 继续执行
代码语言:javascript
复制
function testFinally() {
    try{
        return 0;
    } catch(error) {
        return 1;
    } finally {
        return 2;
    }
}
testFinally();      // 2

注意: (1)只要代码中包含finally子句,那么无论try还是catch语句块中的return语句都将被忽略。因此使用finally子句之前,一定要非常清楚你想让代码怎么样。【IE7及更早版本,除非有catch子句,否则finally中的代码永远不会执行】 (2)在明明白白知道自己的代码会发生错误时,使用try-catch语句是不太合适的!!!

2. 错误类型

(1)Error:供开发人员抛出自定义错误 (2)EvalError:使用eval()函数而发生异常时被抛出【new eval() 实践中,浏览器不一定会抛出该错误】 (3)RangError:数值超出范围时触发【new Array(-10)】 (4)ReferenceError:访问不存在变量时【a;】 (5)SyntaxError:把语法错误的JavaScript字符串传入eval()函数时【eval(“a ++ b”)】 (6)TypeError:执行特定于类型的操作时,变量的类型不符合要求【var a; a();】 (7)URIError:使用encodeURI()、decodeURI()时,URL格式不正确

3. 抛出错误

抛出错误的目的在于提供错误发生具体原因的消息。 在遇到throw操作符时,代码会立即停止执行。仅当有try-catch语句捕获到抛出的值时,代码才会继续执行。 自定义错误消息

代码语言:javascript
复制
function CustomError(message) {
    this.name = "CunstomError";
    this.message = message;
}
CustomError.prototype = new Error();
throw new CustomError("my error message");
4. 捕获错误

捕获错误的目的在于避免浏览器以默认方式处理它们。

代码语言:javascript
复制
function process(values){      
    if (!isArray(values)){
        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;
}

(1)typeof [] ==> “object” (2)values instanceof Array ==> 多框架环境下使用会有问题

代码语言:javascript
复制
function isType(type) {
  return function(obj) {
    return {}.toString.call(obj) == "[object " + type + "]"
  }
}
var isObject = isType("Object");
var isArray = Array.isArray || isType("Array");
5. 错误事件
代码语言:javascript
复制
winow.onerror = function(message, url, line) {
    console.log(message);
    return false;   // 阻止浏览器报告错误的默认行为
}

二、常见错误

(1)类型转换错误 (2)数据类型错误 (3)通信错误

示例:类型转换错误

代码语言:javascript
复制
console.log(5 == "5");
代码语言:javascript
复制
function concat(str1, str2, str3) {
    var result = str1 + str2;
    if(str3) {          // str3 ==> 0
        result += str3;
    }
    return result;
}

示例:数据类型错误

代码语言:javascript
复制
function test(callback) {
    // ...
    if(typeof callback === "function") {
        callback();
    }
}

基本类型的值应该使用typeof检测;对象的值应该使用instanceof检测。

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2016年04月03日,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 一、错误处理
    • 1. try-catch语句
      • 2. 错误类型
        • 3. 抛出错误
          • 4. 捕获错误
            • 5. 错误事件
            • 二、常见错误
            领券
            问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档