javaScript中常见的几种报错类型
一般我们运行代码的时候,在控制台报错会相应的显示你错误的行数,找到那一行,查找你相应的错误
1、xxx is not defined
xxx 没有定义
2、xxx is not a function
xxx 不是一个函数
xxx此时是undefined
3、Cannot read property 'xxx' of undefined
不能读取undefined的xxx属性
xxx前面的变量是undefined
4、Cannot set property 'xxx' of null
不能给null设置xxx属性
xxx前面的变量是null
5、Invalid or unexpected token
标点符号可能是中文
6、Unexpected token a in JSON at position 0
使用JSON.parse进行解析json字符串时,解析的内容不合法
7、XMLHttpRequest cannot load http://XXXXXX. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://XXXXXX' is therefore not allowed access.
使用ajax请求数据时,产生跨域了
8、Illegal break statement
出现了非法语句
9、SyntaxError(语法错误)
SyntaxError是解析代码时发生的语法错误
// 变量名错误
var 1a;
// 缺少括号
console.log ('hello';
10、ReferenceErro(引用错误)
ReferenceError是引用一个不存在的变量时发生的错误。
unknownVariable
// ReferenceError: unknownVariable is not defined
// ReferenceError: unknownVariable is not defined
另一种触发场景是,将一个值分配给无法分配的对象,比如对函数的运行结果或者this赋值。
console.log() = 1
// ReferenceError: Invalid left-hand side in assignment this = 1
// ReferenceError: Invalid left-hand side in assignment
// ReferenceError: Invalid left-hand side in assignment this = 1
// ReferenceError: Invalid left-hand side in assignment
上面代码对函数console.log的运行结果和this赋值,结果都引发了ReferenceError错误
11、RangeError(范围错误)
RangeError是当一个值超出有效范围时发生的错误。主要有几种情况,一是数组长度为负数,二是Number对象的方法参数超出范围,以及函数堆栈超过最大值。
new Array(-1)
// RangeError: Invalid array length
(1234).toExponential(21)
// RangeError: toExponential() argument must be between 0 and 20
// RangeError: Invalid array length
(1234).toExponential(21)
// RangeError: toExponential() argument must be between 0 and 20
12、TypeError(类型错误)
TypeError是变量或参数不是预期类型时发生的错误。比如,对字符串、布尔值、数值等原始类型的值使用new命令,就会抛出这种错误,因为new命令的参数应该是一个构造函数。
new 123
//TypeError: number is not a func var obj = {}; obj.unknownMethod()
// TypeError: undefined is not a function
//TypeError: number is not a func var obj = {}; obj.unknownMethod()
// TypeError: undefined is not a function
上面代码的第二种情况,调用对象不存在的方法,会抛出TypeError错误。
13、URIError(URI错误)
URIError是URI相关函数的参数不正确时抛出的错误,主要涉及encodeURI()、decodeURI()、encodeURIComponent()、decodeURIComponent()、escape()和unescape()这六个函数。
decodeURI('%2')
// URIError: URI malformed
14、EvalError(eval错误)
eval函数没有被正确执行时,会抛出EvalError错误。该错误类型已经不再在ES5中出现了,只是为了保证与以前代码兼容,才继续保留。
以上这6种派生错误,连同原始的Error对象,都是构造函数。开发者可以使用它们,人为生成错误对象的实例。
new Error("出错了!");
new RangeError("出错了,变量超出有效范围!");
new TypeError("出错了,变量类型无效!");
上面代码表示新建错误对象的实例,实质就是手动抛出错误。可以看到,错误对象的构造函数接受一个参数,代表错误提示信息(message)。
15、错误举例
- 找不到引入的.js文件
引用的.js文件找不到,chrome报错信息如下:
GET file:///D:/JavaBooks/js/jquery%20validation/src-gzh/jquery.validate-1.7.src net::ERR_FILE_NOT_FOUND
可能原因:.js文件名字拼写错误(比如,少了文件后缀.js)
- js函数缺少括号),函数体缺少大括号}
如果函数缺少括号或者函数体缺少括号,浏览器debug时都会提示报错信息。这里分2种情况:
1、一般报错信息都在报在错误的地方,这种情况比较好说。
2、但是有的时候会报在其他的地方,这个时候要明白的是,报错信息缺少括号这一点是确定无疑的,现在就是要定位到具体是哪一行报错。
例如
报错函数/函数体缺少括号,报错的地方不是函数/函数体的末尾,而是报在调用该函数的地方。
- css代码使用了//注释,导致有的div内容出不来,然后也不报错
css注释,只能使用/* 注释内容 */,而不能使用双斜杠//。
- 定义了多个同名的变量
浏览器会报错。
- 文档未加载完毕,就开始执行js代码导致的错误
文档/DOM未加载完毕,就开始执行js代码。
比如,js代码写在html代码的前面,而且document.getElementById('traffic')这样来访问DOM(即文档的元素),那么这个时候就会报TypeError: a is null(火狐浏览器,注:a变量没用,只会起误导作用)或者Uncaught TypeError: Cannot read property 'click2' of null(谷歌浏览器)。
- js 对象的函数未定义
浏览器报错,说对象的函数未定义,这个时候可以肯定的一点是,当前这个对象是没有这个函数的。
比如,高德地图对象函数未定义,是因为地图对象被2.5维地图对象覆盖了。
出现这种bug时,问题在函数,往往是因为对象被重复定义,或者被重新赋值了。