资讯专栏INFORMATION COLUMN

上云采购季！| 2核2G4M爆款云服务器低至59元/年，更有多台、长期优惠，快来选购！

立即前往
首页/文章专栏/javascript错误处理类型

javascript错误处理类型

lylwyy2016 / 2517人阅读

摘要：来聊一聊每一种错误类型的使用和出错的场景。不属于有效类型。例如抛出错误自定义错误类型有时候希望自定义错误类型，需要自定义一个构造函数，然后让原型继承继承即可。例如以下调用错误信息为以上为抛错的构造函数的总结，如有误之处欢迎扶正。

在写javascript的时候，调试错误必不可少，除了能够在浏览器中打印出来错误外，常常还需要知道错误的类型是什么，以便对症下药的纠错；也有时候，在自己封装的工具函数中，不传参或传入了错误类型的参数，也要适当的抛出一些错误以示警告；使用框架不正常情况下也会抛出错误，如果对错误一无所知，便无从下手调试。综合上述，了解错误的处理机制是多么必要，以下是笔者归纳总结，如有误之处，欢迎指出。

错误构造函数

javascript规范中总共有8中错误类型构造函数

Error -- 错误对象

SyntaxError --解析过程语法错误

TypeError -- 不属于有效类型

ReferenceError -- 无效引用

RangeError -- 数值超出有效范围

URIError -- 解析URI编码出错

EvalError -- 调用eval函数错误

InternalError -- Javascript引擎内部错误的异常抛出， "递归太多"

其中两种做个特殊说明：

EvalError调用eval函数错误，已经弃用，为了向后兼容，低版本还可以使用。
InternalError 递归过深 抛出错误，多数浏览器未实现，属于非标准方法，生产环境禁用
继承关系

Error是错误的基类，其他类型都继承Error这个类，可以使用ES6中提供的Object.getPrototypeOf()来判断，一个类是否继承了另一个类。

console.log(Object.getPrototypeOf(SyntaxError) === Error);    // true
console.log(Object.getPrototypeOf(TypeError) === Error);   // true
console.log(Object.getPrototypeOf(ReferenceError) === Error);   // true
console.log(Object.getPrototypeOf(RangeError) === Error);   // true
console.log(Object.getPrototypeOf(URIError) === Error);   // true
console.log(Object.getPrototypeOf(EvalError) === Error);   // true

来聊一聊每一种错误类型的使用和出错的场景。

Error

通过Error的构造器可以创建一个错误对象。当运行时错误产生时，Error的实例对象会被抛出。

语法：new Error([message])

参数：

message 可选，错误描述信息。

抛出错误

使用throw语句来抛出异常

throw new Error("这里抛出的是错误信息")

运行后，会在控制台打印输出：

Uncaught Error: 这里抛出的是错误信息

注意： 使用throw抛出异常后，之后的代码不再执行。

捕获错误

可以通过try{}catch(){}语句来捕获到这个错误

try{
    throw new Error("这里抛出的是错误信息")
}catch(err){
    alert(err.name + " "+ err.message)
}

属性说明：
当使用new Error创建错误实例后，会有两个属性：

let e =  new Error("这里抛出的是错误信息");

name属性，为错误的类型，此时为Error
message属性，为错误的信息，此时为"这里抛出的是错误信息"

SyntaxError

解析过程语法错误,这种类型抛出的错误有很多，往往是书写时候造成的语法错误，例如：

 let n = 11;   // Uncaught SyntaxError: Invalid or unexpected token
 let str = "hel"lo" // Uncaught SyntaxError: Unexpected identifier
 let 123Var = "hi" // Uncaught SyntaxError: Invalid or unexpected token

语法错误有很多就不一一列举了，当在浏览器运行时，控制台会抛错，并且告知第几行，所以调试器来比较方便。但要读懂错误的类型为SyntaxError，以及后面的错误信息，这样方便改错。

TypeError

不属于有效类型。这种错误就是在给的不是需要的类型而导致无法操作，会抛出类型错误。

变量或参数不是预期类型，

例如**new**运算符后必须是函数，而给定的不是函数，则会抛出类型错误

let fn = "hello";
new fn;

抛出错误：

Uncaught TypeError: fn is not a constructor

调用对象不存在的方法

let obj = {};
obj.fn()

抛出错误：

Uncaught TypeError: obj.fn is not a function

当然你也可以在封装函数时候，强制传入的参数为指定类型，否则抛出类型错误。

function flatten(arr){
    if( !Array.isArray(arr) ){
        throw new TypeError("传入参数不是数组")
    }    
}
flatten("test");

传入的参数不为数组时，抛出自定义的类型错误：

Uncaught TypeError: 传入参数不是数组
ReferenceError

无效引用。

引用了一个不存在的变量

console.log(a);

抛出错误

Uncaught ReferenceError: a is not defined

将变量赋值给一个无法被赋值的数据
这个错误常常犯的地方实在调用一个方法后在if语句中做判断，将比较运算符==写成了赋值运算符=，例如判断一个字符串第一个字符是不是指定的字符：

let str = "hello";
if( str.charAt(0) = "h" ){
    console.log("第一个字符为h");
}

抛出错误：

Uncaught ReferenceError: Invalid left-hand side in assignment
RangeError

数值超出有效范围。在一些方法中，传入的数值必须在一定的范围内，否则会抛出超出范围的错误。

创建数组传入的长度小于了0

let arr = new Array(-1)

抛出错误：

Uncaught RangeError: Invalid array length

repeat方法重复指定的字符串重复次数小于0

let str = "hello";
str.repeat(-1)

抛出错误：

Uncaught RangeError: Invalid count value
URIError

处理URI编码出错。函数参数不正确，主要是encodeURI()、decodeURI()、encodeURIComponent()、decodeURIComponent()、escape()和unescape()这六个函数。

例如：

decodeURIComponent("%");
decodeURI("%2")

抛出错误：

Uncaught URIError: URI malformed
自定义错误类型

有时候希望自定义错误类型，需要自定义一个构造函数，然后让原型继承继承Error.prototype即可。

function MyErrorType(message){
    this.message = message || "错误";
    this.name = "MyErrorType";
    this.stack = (new Error()).stack;  // 错误位置和调用栈
}

MyErrorType.prototype = Object.create(Error.prototype);
MyErrorType.prototype.constructor = MyErrorType;

throw new MyErrorType("自定义错误类型抛出错误")
关于调用的错误栈信息

提供的错误的跟踪功能，以什么样的调用顺序，在哪个文件的哪一行捕获到这个错误。
例如以下调用：

function trace() {
  try {
    throw new Error("myError");
  }
  catch(e) {
    console.log(e.stack);
  }
}
function b() {
  trace();
}
function a() {
  b(3, 4, "

", undefined, {});
}
a("first call, firstarg");

错误信息为：

Error: myError
    at trace (:3:14)
    at b (:10:6)
    at a (:13:6)
    at :15:4

以上为抛错的构造函数的总结，如有误之处欢迎扶正。
以上每一种错误场景并没有列出太多，如果你有新的错误信息发现，欢迎留言讨论。

GPU云服务器 云服务器 php错误处理 ASP错误处理 asp 错误处理 java类型错误

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

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

相关文章

  • JavaScript之错误异常探讨

    摘要：提供一套错误处理机制，错误是干扰程序正常流程的非正常的事故。构造函数是通用错误类型，除了类型，还有等类型。浏览器输出其他错误类型构造函数是继承，实例是一致的。数值超出有效范围数值超出有效范围创建一个实例，表示错误的原因无效引用。 同步发布于 https://github.com/xianshanna... 我的建议是不要隐藏错误，勇敢地抛出来。没有人会因为代码出现 bug 导致程序崩溃...

    LdhAndroid 评论0 收藏0

  • JavaScript 错误处理与调试——“错误处理”的注意要点

    摘要：使用函数发生异常时抛出。数值超出相应范围时抛出。抛出错误与相配的还有一个操作符，用于抛出自定义错误。错误事件没有通过处理的错误都会触发对象的事件。任何浏览器中，事件处理程序都不会创建对象，但它可以接受个参数错误消息错误所在的和行号。 try-catch语句 该语句最适合处理那些我们无法控制的错误，在明明白白地知道自己的代码会发生错误时，再使用该语句就不太合适了。 ECMA-262第3...

    draveness 评论0 收藏0

  • JavaScript 编程精解 中文第三版 八、Bug 和错误

    摘要：幸运的是，使用符号创建的构造器，如果在不使用来调用，则始终会报错，即使在非严格模式下也不会产生问题。 来源：ApacheCN『JavaScript 编程精解 中文第三版』翻译项目原文：Bugs and Errors 译者：飞龙 协议：CC BY-NC-SA 4.0 自豪地采用谷歌翻译 部分参考了《JavaScript 编程精解（第 2 版）》 调试的难度是开始编写代码的两倍。 因此，如...

    wujl596 评论0 收藏0

  • JavaScript 中的错误处理机制

    摘要：错误处理在开发和调试过程中都显得尤为重要。跟全局函数有关的错误，在之后已经不再出现了内部错误。由引擎抛出的错误范围错误。事件任何没有的错误都会触发对象的事件。事件可以接收三个参数错误消息错误所在的和行号。 错误处理在开发和调试过程中都显得尤为重要。有些没有进行错误处理的应用，直接就将浏览器的错误展示给了用户，极大的降低了用户体验。比如有些很 low 的网站，打开某些页面就直接弹出 ob...

    AbnerMing 评论0 收藏0

  • 错误检测（1）------try-catch语句 From 《高程3》

    摘要：类型的错误会在数值超出相应范围时触发。最常发生类型错误的情况，就是传递给函数的参数事先未经检查，结果传入类型与预期类型不相符。捕获错误的目的在于避免浏览器以默认方式处理它们而抛出错误的目的在于提供错误发生具体原因的消息。 0 前言 目前读到了《高程3》的错误检测部分，现在先挖一个坑，关于错误检测应该写三篇总结：firebug检测错误和输出信息；try-catch错误捕获；常见错误种类。...

    UnixAgain 评论0 收藏0

发表评论

登陆后可评论

0条评论

lylwyy2016

男|高级讲师
我要私信

TA的文章

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