0

0

javascript错误处理机制的介绍(附示例)

不言

不言

发布时间:2018-10-19 15:29:43

|

2255人浏览过

|

来源于segmentfault思否

转载

本篇文章给大家带来的内容是关于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(RangeError) === Error);   // true
console.log(Object.getPrototypeOf(URIError) ===  Error);   // true
console.log(Object.getPrototypeOf(EvalError) === Error);   // true
console.log(Object.getPrototypeOf(ReferenceError) === Error); // true

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

立即学习Java免费学习笔记(深入)”;

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
调用对象不存在的方法

PHP5学习对象教程
PHP5学习对象教程

PHP5学习对象教程由美国人古曼兹、贝肯、瑞桑斯编著,简张桂翻译,电子工业出版社于2007年12月1日出版的关于PHP5应用程序的技术类图书。该书全面介绍了PHP 5中的新功能、编程方法及设计模式,还分析阐述了PHP 5中新的数据库连接处理、错误处理和XML处理等机制,帮助读者系统了解、熟练掌握和高效应用PHP。

下载
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, '\n\n', undefined, {});
}
a('first call, firstarg');

错误信息为:
Error: myError
  at trace (:3:14)
  at b (:10:6)
  at a (:13:6)
  at :15:4
以上为抛错的构造函数的总结,如有误之处欢迎扶正。

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
es6新特性
es6新特性

es6新特性有:1、块级作用域变量;2、箭头函数;3、模板字符串;4、解构赋值;5、默认参数;6、 扩展运算符;7、 类和继承;8、Promise。本专题为大家提供es6新特性的相关的文章、下载、课程内容,供大家免费下载体验。

103

2023.07.17

es6新特性有哪些
es6新特性有哪些

es6的新特性有:1、块级作用域;2、箭头函数;3、解构赋值;4、默认参数;5、扩展运算符;6、模板字符串;7、类和模块;8、迭代器和生成器;9、Promise对象;10、模块化导入和导出等等。本专题为大家提供es6新特性的相关的文章、下载、课程内容,供大家免费下载体验。

195

2023.08.04

JavaScript ES6新特性
JavaScript ES6新特性

ES6是JavaScript的根本性升级,引入let/const实现块级作用域、箭头函数解决this绑定问题、解构赋值与模板字符串简化数据处理、对象简写与模块化提升代码可读性与组织性。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

222

2025.12.24

java基础知识汇总
java基础知识汇总

java基础知识有Java的历史和特点、Java的开发环境、Java的基本数据类型、变量和常量、运算符和表达式、控制语句、数组和字符串等等知识点。想要知道更多关于java基础知识的朋友,请阅读本专题下面的的有关文章,欢迎大家来php中文网学习。

1501

2023.10.24

Go语言中的运算符有哪些
Go语言中的运算符有哪些

Go语言中的运算符有:1、加法运算符;2、减法运算符;3、乘法运算符;4、除法运算符;5、取余运算符;6、比较运算符;7、位运算符;8、按位与运算符;9、按位或运算符;10、按位异或运算符等等。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

232

2024.02.23

php三元运算符用法
php三元运算符用法

本专题整合了php三元运算符相关教程,阅读专题下面的文章了解更多详细内容。

87

2025.10.17

if什么意思
if什么意思

if的意思是“如果”的条件。它是一个用于引导条件语句的关键词,用于根据特定条件的真假情况来执行不同的代码块。本专题提供if什么意思的相关文章,供大家免费阅读。

778

2023.08.22

counta和count的区别
counta和count的区别

Count函数用于计算指定范围内数字的个数,而CountA函数用于计算指定范围内非空单元格的个数。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

198

2023.11.20

俄罗斯Yandex引擎入口
俄罗斯Yandex引擎入口

2026年俄罗斯Yandex搜索引擎最新入口汇总,涵盖免登录、多语言支持、无广告视频播放及本地化服务等核心功能。阅读专题下面的文章了解更多详细内容。

158

2026.01.28

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
React 教程
React 教程

共58课时 | 4.2万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 2.5万人学习

Bootstrap 5教程
Bootstrap 5教程

共46课时 | 3万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号