7种你应该知道的JavaScript常见的错误
转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具、解决方案和服务,赋能开发者。
原文出处:https://blog.bitsrc.io/types-of-native-errors-in-javascript-you-must-know-b8238d40e492

从浏览器的控制台到运行Node.js的计算机终端,我们到处都会看到各类错误。
这篇文章的重点是概述我们在JS开发过程中可能遇到的错误类型。
1. RangeError
当数字超出允许的值范围时,将抛出此错误。
例如,
const l = console.log
const arr = [90,88]
arr.length=90**99
我们有一个带有两个元素的arr。接下来,我们尝试使数组包含90**99 == 2.9512665430652753e+193元素。
这个数字超出了大小数组可以增长的范围。所以运行时它会抛出RangeError:
$ node errors
errors.js:4
arr.length=90**99
^
RangeError: Invalid array length
因为我们要增加arr数组的数量超出了JS指定的范围。
2. ReferenceError
当对变量/项的引用被破坏或不存在时,将引发此错误。也就是说,变量/项不存在。
例如,
const l=console.log const cat = "cat"
cat
dog
我们有一个变量cat初始化为“ cat”。接下来,我们引用cat变量和dog变量。cat变量存在,而dog变量不存在。
cat将返回“ cat”,而dog会引发ReferenceError,因为在环境记录中找不到名为dog的变量。
$ node errors
errors.js:3
dog
^ ReferenceError: dog is not defined
每当我们创建或定义变量时,变量名称都会写入环境记录中。此环境记录就像键值存储表一样,如下图:
+-------------+
| Key | Value |
---------------
| cat | "cat" |
+-------------+
每当我们引用变量时,它都会存储程序中定义的变量。当在记录中找到环境值并提取并返回值时,将以该变量的名称作为关键字搜索环境记录。调用尚未定义的函数。
现在,当我们创建或定义一个没有赋值的变量时。变量将键作为变量名写入环境记录,但该值将保持未定义状态。
var cat env record
+-----------------+
| Key | Value |
-------------------
| cat | undefined |
+-----------------+
稍后为变量分配值时,将在env记录中搜索该变量,当发现该初始未定义值时,该赋值将被覆盖。
var cat
cat = "cat" env record
+-------------+
| Key | Value |
---------------
| cat | "cat" |
+-------------+
因此,当在env记录中找不到变量名时,JS引擎会抛出RefernceError。
+-------------+
| Key | Value |
---------------
| cat | "cat" |
+-------------+
cat // "cat", yes, :) it's there
dog // :( what's this? can't find it
注意:未定义的变量不会抛出ReferenceError,因为它存在于环境记录中只是它的值尚未设置。
3. SyntaxError
这是我们遇到的最常见的错误。当我们键入JS引擎难以理解的代码时,会出现此错误。解析期间,JS引擎捕获了此错误。
在JS引擎中,我们的代码经历了不同的阶段,然后才能在终端上看到运行结果。
- 标记化
- 解析
- 执行
标记化将源代码分解为各个单元。在这个阶段,将对数字,关键字,文字,运算符进行分类并分别进行标记。接下来,生成的token流将传递到解析阶段,由解析器处理。这是从token生成AST的地方。AST是我们代码结构的抽象数据结构。
在标记化和解析这两个阶段,如果我们代码的语法不符合JS的语法规则,则会使执行阶段失败并引发SyntaxError。例如,
const l = console.log
let cat h =“ cat”
这里的“h”明显是多余的,所以由于多了这个字符,会导致引擎抛出SyntaxError
$ node errors
errors.js:3
let cat h = "cat"
^ SyntaxError: Unexpected identifier
很显然,Node.js引擎发现了错误,由于这个不和谐字符的出现,导致cat变量的声明失败了。
4. TypeError
TypeError 是指对象用来表示值的类型非预期类型时发生的错误。例如,我们期望它是布尔值,但结果发现它是string类型。
再例如:
const num = 123
num.toUpperCase()
这会引发TypeError
$ node errors
errors.js:4
num.toUpperCase()
^ TypeError: num.toUpperCase is not a function
因为toUpperCase函数需要字符串数据类型。toUpperCase函数是有意通用的;它不需要其this值是String对象。因此,可以将其转移到其他种类的对象中用作方法。
如果我们在Objects,Boolean,Symbol,null,undefined数据类型上调用toUpperCase函数,则只有字符串会转换为大写或小写形式,我们将得到TypeError,因为它操作的数据类型错误。
5. URIError
这说明了使用一种全局URI处理功能与其定义不兼容。
JS中的URI(统一资源指示符)具有以下功能:decodeURI,decodeURIComponent等。
如果我们用错误的参数调用其中任何一个,我们将得到一个URIError。
decodeURI("%")
^
URIError: URI malformed
encodeURI,获取URI的未编码版本。“%”不是正确的URI,因此引发了URIError。
编码或解码URI时出现问题时,将引发URIError。
6. EvalError
如果非法调用 eval(),则抛出 EvalError 异常。
根据EcmaSpec 2018版:
此异常不再会被JavaScript抛出,但是EvalError对象仍然保持兼容性。
7. InternalError
该错误在JS引擎内部发生,特别是当它有太多数据要处理并且堆栈增长超过其关键限制时。
当JS引擎被太多的递归,太多的切换情况等淹没时,就会发生这种情况
switch(num) {
case 1:
...
break
case 2:
...
break
case 3:
...
break
case 4:
...
break
case 5:
...
break
case 6:
...
break
case 7:
...
break
... up to 1000 cases
}
太多的递归,一个简单的例子是这样的:
function foo() {
foo()
}
foo()
结论
正如我们所说,没有人能不犯错误。就我们输入的代码而言,发生错误是难以避免的。不过为了避免更多的错误出现,我们需要知道抛出的错误的类型是什么,我们该如何解决。
所以我们在这篇文章中列出了它们,并提供了一些示例来简要的来介绍了它们是如何发生的。
最后,希望本文的一些浅见能为你写出更好的代码提供一些帮助,谢谢!
7种你应该知道的JavaScript常见的错误的更多相关文章
- 5种你未必知道的JavaScript和CSS交互的方法
随着浏览器不断的升级改进,CSS和JavaScript之间的界限越来越模糊.本来它们是负责着完全不同的功能,但最终,它们都属于网页前端技术,它们需要相互密切的合作.我们的网页中都有.js文件和.css ...
- 那些必须要知道的Javascript
原文:那些必须要知道的Javascript JavaScript是前端必备,而这其中的精髓也太多太多,最近在温习的时候发现有些东西比较容易忽略,这里记录一下,一方面是希望自己在平时应用的时候能够得心应 ...
- [译] 你该知道的javascript作用域 (javascript scope)(转)
javascript有一些对于初学者甚至是有经验的开发者都难以理解的概念. 这个部分是针对那些听到 : 作用域, 闭包, this, 命名空间, 函数作用域, 函数作用域, 全局作用域, 变量作用域( ...
- 你应该知道的JavaScript中NaN的秘密
NaN,不是一个数字,是一种特殊的值来代表不可表示的值,使用typeof或其他任何与之比较的处理方式,‘NaN’则会引起一些混乱, 一些操作会导致NaN值的产生.这里有些例子: Math.sqrt(- ...
- Web程序员应该知道的Javascript prototype原理
有同事问了我几个和Javascript的类继承的小问题,我在也不太理解的情况下,胡诌了一通. 回来以后有些内疚, 反省一下, 整理整理Javascript的prototype的原理, 自己清楚点, 也 ...
- 今天才知道的JavaScript的真实历史~[转]
JavaScript真的继承自Cmm吗?JavaScript与Java有多少关系?JavaScirpt最初的设计是怎样的?这个文章是从一个叫编程人生的网站上看到的.不知道出处在哪.在许多资料,Java ...
- 5种你未必知道的JS和CSS交互的方法
随着浏览器不断的升级改进,CSS和JavaScript之间的界限越来越模糊.本来它们是负责着完全不同的功能,但最终,它们都属于网页前端技术,它们需要相互密切的合作.我们的网页中都有.js文件和.css ...
- 你需要知道的 JavaScript 类(class)的这些知识
作者: Dmitri Pavlutin译者:前端小智来源:dmitripavlutin 点赞再看,养成习惯 本文 GitHub https://github.com/qq44924588... 上已经 ...
- 每一个JavaScript开发者都应该知道的10道面试题
JavaScript十分特别.而且差点儿在每一个大型应用中起着至关关键的数据.那么,究竟是什么使JavaScript显得与众不同,意义非凡? 这里有一些问题将帮助你了解其真正的奥妙所在: 1.你能 ...
随机推荐
- android形状属性、锁屏密码、动态模糊、kotlin项目、抖音动画、记账app、视频播放器等源码
Android精选源码 直观了解Android的"形状"属性如何影响Drawable的外观. 一个灵活的视频播放器, 可替换播放器内核. android锁屏输入密码功能源码 背景动 ...
- 吴裕雄--天生自然python学习笔记:python实现自动网页测试
Python 可实现的网页测试的功能十分强大,甚至能通 过编程来实现让绝大多数的测试过程自动化. 这对很多开 发者来说,绝对是不可多得的神器. hash lib 纽件可以判别文件是否有过更改,只需要用 ...
- 规范化开发和time相关模块
1. 规范化开发 如果在开发的过程中将所有的程序放在一个py文件中,加载时会很慢,同时降低了代码的可读性,查询起来也麻烦 所以要将一个oy文件合理的分成多个py文件,在blog大目录下分为以下几个部分 ...
- 由情感计算带来的惊喜发现——记Rosalind W. PICARD“21世纪的计算”大会主题演讲
W. PICARD"21世纪的计算"大会主题演讲" title="由情感计算带来的惊喜发现--记Rosalind W. PICARD"21世纪的计算& ...
- Bringing up interface eth0: Device eth0 does not seem to be present, delaying initialization.FAILED
1.service network stop 2./etc/sysconfig/network-scripts目录下,删除想要删除的网卡配置,我要删除eth1,所以rm -rf ifcfg-eth1, ...
- SHELL用法三(变量及参数设置)
京峰JF2115-Day45上课笔记 1.SHELL编程变量命名规范: 变量分为:系统变量.环境变量.用户变量: 定义变量时使用=赋值,无需通过declare定义变量的类型: 变量赋值时,=前后是不能 ...
- 3dmax2020卸载/安装失败/如何彻底卸载清除干净3dmax2020注册表和文件的方法
3dmax2020提示安装未完成,某些产品无法安装该怎样解决呢?一些朋友在win7或者win10系统下安装3dmax2020失败提示3dmax2020安装未完成,某些产品无法安装,也有时候想重新安装3 ...
- SpringBoot中Shiro使用Pac4j集成CAS认证
SpringBoot中Shiro使用Pac4j集成CAS认证 Pac4j 简介 Pac4j与Shiro,Spring Security一样都是权限框架,并且提供了OAuth - SAML - CAS ...
- 浅谈JobExecutionContext & JobDataMap
JobExecutionContext是什么? 当Scheduler调用一个Job,就会将JobExecutionContext传递给Job的 execute() 方法: Job能通过JobExecu ...
- SWUST OJ 爬不出去的水井(0333)
爬不出去的水井(0333) Time limit(ms): 1000 Memory limit(kb): 65535 Submission: 1069 Accepted: 150 Descriptio ...