JS常见报错与修复

如何读懂错误?

首先,让我们快速看下错误信息的结构。理解结构有助于理解错误,如果遇到列表之外的错误会减少麻烦。

Chrome 中典型的错误像这样:

Uncaught TypeError: undefined is not a function

错误的结构如下:

  1. Uncaught TypeError: 这部分信息通常不是很有用。Uncaught 表示错误没有被 catch 语句捕获,TypeError 是错误的名字。
  2. undefined is not a function: 这部分信息,你必须逐字阅读。比如这里表示代码尝试使用 undefined,把它当做一个函数。

其它基于 webkit 的浏览器,比如 Safari ,给出的错误格式跟 Chrome 很类似。Firefox 也类似,但是不总包含第一部分,最新版本的 IE 也给出比 Chrome 简单的错误 - 但是在这里,简单并不总代表好。

以下是真正的错误。

Uncaught TypeError: undefined is not a function

相关错误:

number is not a function, object is not a function, string is not a function, Unhandled Error: ‘foo’ is not a function, Function Expected

当尝试调用一个像方法的值时,这个值并不是一个方法。比如:

var foo = undefined;
foo();

如果你尝试调用一个对象的方法时,你输错了名字,这个典型的错误很容易发生。

var x = document.getElementByID(‘foo‘);

由于对象的属性不存在,默认是 undefined ,以上代码将导致这个错误。尝试调用一个像方法的数字,“number is not a function” 错误出现。

如何修复错误:确保方法名正确。这个错误的行号将指出正确的位置。

Uncaught ReferenceError: Invalid left-hand side in assignment

相关错误:

Uncaught exception: ReferenceError: Cannot assign to ‘functionCall()’, Uncaught exception: ReferenceError: Cannot assign to ‘this’

尝试给不能赋值的东西赋值,引起这个错误。

这个错误最常见的例子出现在 if 语句使用:

if(doSomething() = ‘somevalue‘)

此例中,程序员意外地使用了单个等号,而不是双等号。“left-hand side in assignment” 提及了等号左手边的部分,因此你可以看到以上例子,左手边包含不能赋值的东西,导致这个错误。

如何修复错误:确保没有给函数结果赋值,或者给 this 关键字赋值。

Uncaught TypeError: Converting circular structure to JSON

相关错误:

Uncaught exception: TypeError: JSON.stringify: Not an acyclic Object, TypeError: cyclic object value, Circular reference in value argument not supported

把循环引用的对象,传给 JSON.stringify 总会引起错误。

var a = { };
var b = { a: a };
a.b = b;
JSON.stringify(a);

由于以上的 a 和 b 循环引用彼此,结果对象无法转换成 JSON。

如何修复错误: 移除任何想转换成 JSON 的对象中的循环引用。

Unexpected token ;

相关错误:

Expected ), missing ) after argument list

JavaScript 解释器预期的东西没有被包含。不匹配的圆括号或方括号通常引起这个错误,错误信息可能有所不同 - “Unexpected token ]” 或者 “Expected {” 等。

如何修复错误: 有时错误出现的行号并不准确,因此很难修复。

  • [ ] { } ( ) 这几个符号不配对常常导致出错。检查所有的圆括号和方括号是否配对。行号指出的不仅是问题字符。
  • Unexpected / 跟正则表达式有关。此时行号通常是正确的。
  • Unexpected ; 对象或者数组字面量里面有个;通常引起这个错误,或者函数调用的参数列表里有个分号。此时的行号通常也是正确的。

Uncaught SyntaxError: Unexpected token ILLEGAL

相关错误:

Unterminated String Literal, Invalid Line Terminator

一个字符串字面量少了结尾的引号。

如何修复错误: 确保所有的字符串都有结束的引号。

Uncaught TypeError: Cannot read property ‘foo’ of null, Uncaught TypeError: Cannot read property ‘foo’ of undefined

相关错误:

TypeError: someVal is null, Unable to get property ‘foo’ of undefined or null reference

尝试读取 null 或者 undefined ,把它当成了对象。例如:

var someVal = null;
console.log(someVal.foo);

如何修复错误: 通常由于拼写错误导致。检查错误指出的行号附近使用的变量名是否正确。

Uncaught TypeError: Cannot set property ‘foo’ of null, Uncaught TypeError: Cannot set property ‘foo’ of undefined

相关错误:

TypeError: someVal is undefined, Unable to set property ‘foo’ of undefined or null reference

尝试写入 null 或者 undefined ,把它当成了一个对象。例如:

var someVal = null;
someVal.foo = 1;

如何修复错误: 也是由于拼写错误所致。检查错误指出的行号附近的变量名。

Uncaught RangeError: Maximum call stack size exceeded

相关错误:

Related errors: Uncaught exception: RangeError: Maximum recursion depth exceeded, too much recursion, Stack overflow

通常由程序逻辑 bug 引起,导致函数的无限递归调用。

如何修复错误: 检查递归函数中可能导致无限循环 的 bug 。

Uncaught URIError: URI malformed

相关错误:

URIError: malformed URI sequence

无效的 decodeURIComponent 调用所致。

如何修复错误: 按照错误指出的行号,检查 decodeURIComponent 调用,它是正确的。

XMLHttpRequest cannot load [http://some/url/](http://some/url/). No ‘Access-Control-Allow-Origin’ header is present on the requested resource

相关错误:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at
[http://some/url/](http://some/url/)

错误肯定是使用 XMLHttpRequest 引起的。

如何修复: 确保请求的 URL 是正确的,它遵循同源策略 。最好的方法是从代码中找到错误信息指出的 URL 。

InvalidStateError: An attempt was made to use an object that is not, or is no longer, usable

相关错误:

InvalidStateError, DOMException code 11

代码调用的方法在当前状态无法调用。通常由 XMLHttpRequest 引起,在方法准备完毕之前调用它会引起错误。

var xhr = new XMLHttpRequest();
xhr.setRequestHeader(‘Some-Header‘, ‘val‘);

这时就会出错,因为 setRequestHeader 方法只能在 xhr.open 方法之后调用。

如何修复: 查看错误指出的行号,确保代码运行的时机正确,或者在它(例如 xhr.open)之前添加了不必要的调用

结论

我看过不少无用的 JavaScript 错误,比如 PHP 中声名狼藉的异常 Expected T_PAAMAYIM_NEKUDOTAYIM 。抛出更熟悉的错误才更有意义。现代浏览器不再抛出完全无用的错误,才会更有帮助。

时间: 2024-10-26 13:12:44

JS常见报错与修复的相关文章

js常见报错解决方法

3.获得类名document.getElementsClassName(常出现一个问题): getClassName("gn","pt")[0].appendChild(a); getClassName("gn","pt")这里是自定义获取类名的函数(可以看我写的js自定义获取类名函数),类名是可以重复多个的,这时我们就要给它指定是第几个追加函数,如果不指定,就会报错.下面是报错情况,如果加上[0]就不会报错 原文地址:htt

js常见报错之Unexpected token in JSON at position

源头 ??出现这个报错提示,根本原因只有一个--json解析异常,至于本文血案的导火索是因为json注释滴问题. 事发--血案 ??有一天一个朋友找我商量,说用jquery的ajax什么都写对了,可数据就是不正常显示,我说发核心代码我look下,如图1 ??我也反复检查了几遍确实没问题,那......我突然发现他的代码中只存在了异步success的回调,既然不走成功回调,那就看下error函数咯,error函数我们不经常使用,其有三个参数XMLHttpRequest对象, textStatus错

cocos2d-js运行游戏常见报错

作为新手,参考官网案例自己再打一遍代码运行游戏时常会出现许多相同报错,有的是由于自己单词拼写错误,或者文件未加载等,在写代码的时候一定要细心细心再细心,下面是我这两天运行出现的一些报错及我的解决方法,多是自己搜索外带摸索总结的,有什么不对的敬请指正,当然,运行过程中也许会有各种问题,我这边也可能只是极少数,后续碰到的会继续更新,希望大家看到并可以解决的也可以共享下. 运行游戏常见报错: 1.loader for [null] not exists! 尝试方法:极有可能是加载什么类型的资源没有后缀

android开发_git操作中常见报错及解决办法

Focus on technology, enjoy life!-- QQ:804212028 浏览链接:http://blog.csdn.net/y18334702058/article/details/44624305 主题:git操作中常见报错 - 如果输入$ git remote add origin [email protected]:xxx(github帐号名)/yyy(项目名).git 提示出错信息:fatal: remote origin already exists. 解决办法

web报表工具FineReport使用中遇到的常见报错及解决办法(一)

FineReport使用中遇到的常见报错及解决办法(一) 这里写点抛砖引玉,希望大家能把自己整理的问题及解决方法晾出来,Mark一下,利人利己. 出现问题先搜一下文档上有没有,再看看度娘有没有,再看看论坛有没有.有报错要看日志.下面简单罗列下常见的问题,大多文档上都有提到的. 1.address pool is full: 含义:地址池满,连接数超过并发数上限. 解决办法: 若在FineReport的连接池属性的设置中,已将最大连接数设置得过大,还出现如上的报错,此时通常就是数据库进程(proc

java报表工具FineReport使用中遇到的常见报错及解决办法(一)

FineReport使用中遇到的常见报错及解决办法(一) 这里写点抛砖引玉,希望大家能把自己整理的问题及解决方法晾出来,Mark一下,利人利己. 出现问题先搜一下文档上有没有,再看看度娘有没有,再看看论坛有没有.有报错要看日志.下面简单罗列下常见的问题,大多文档上都有提到的. 1.address pool is full: 含义:地址池满,连接数超过并发数上限. 解决办法: 若在FineReport的连接池属性的设置中,已将最大连接数设置得过大,还出现如上的报错,此时通常就是数据库进程(proc

使用iis7.5搭建ASP网站常见报错问题处理

iis7.5 解析 ASP 出错主要有三类: 1. 权限问题 2. 程序问题 3. 应用池问题 1. 权限问题: 如果访问网站后有典型的无权查看报错提醒, 那么重新配置相关用户的权限即可, 最简单的办法是直接添加一 Everyone 用户, 给 Everyone 加读取权限即可, 此处操作简单, 不多赘述, 需要注意的是, 500报错也可能是权限问题, 请留意排错, 如图所见,                  2. 程序问题: asp程序不能正常解析, 此处主要问题来源有: a. asp未启用

rabbitmq编译部署以及常见报错

(一)源码安装Erlang(1)下载erlang源码包wget http://www.erlang.org/download/otp_src_R13B04.tar.gz(2)解压缩erlang源码包tar -zxvf otp_src_R13B04.tar.gz(3)安装./configure??--prefix=/usr/local/erlang./make./make install如果抛出如下错误No curses library functions found请先安装?curses lib

Zabbix 常见报错

Zabbix 常见报错 一.zabbix web上出现Get value from agent failed: ZBX_TCP_READ() failed: [104] Connection reset by peer 1. Debug 过程: 1.1 在zabbix server 上使用get 命令时出现:1.2 查看zabbix_agent 日志出现failed to accept an incoming connection: connection from "28.44.20.129&q