前端项目中常见的报错类型汇总-CSDN博客

声明：文章参考了《javascript高级程序设计第三版》，并结合了一些简单的例子，自己再次整合，整理出js常见的报错，以便用于学习交流

1.错误分为两种

代码错误：这种错误浏览器会报错，可以根据具体的错误类型去排错。
逻辑错误：这种错误浏览器不会报错，但是可以通过打印日志，或者打断点进行调试排错。

2.javascript中的七种错误类型

SyntaxError（语法错误）

报错为：Uncaught Syntaxerror：相关信息提示。表示解析代码时发生的语法错误，即写的代码不符合js编码规则。我们可以根据后面的信息提示去修改错误，当然，语法错误，浏览器会直接报错，整个代码都不会执行。

如下：第一种：变量名错误导致；第二种：缺少括号

声明变量：var / let / const / function，当创建一个变量时会在内存中的栈区开辟一个新的空间。
变量命名规则和规范：
规则：
1.由字母、数字、下划线、$符号组成，不能以数字开头
2.不能是关键字和保留字，例如：for,while,this,name
3.区分大小写
规范：
1.变量名必须有意义
2.遵守驼峰命名法
3.建议不要用$作为变量名

ReferenceError（引用错误）

报错为：Uncaught ReferenceError：***，表示使用了没有定义的变量，错误之前的代码会执行，之后代码不会执行。

如下：第一种：引用了一个不存在的变量；第二种：将变量赋值给一个无法被赋值的对象;第三种：使用JSON.parse进行解析json字符串时，解析的内容不合法

RangeError（范围错误）

RangeError是当一个值超出有效范围时发生的错误。主要有几种情况，一是数组长度为负数，二是Number对象的方法参数超出范围，以及函数堆栈超过最大值。

TypeError（类型错误）

(1) 变量或参数不是预期类型，比如，对字符串、布尔值、数值等原始类型的值使用new命令，就会抛出这种错误，因为new命令的参数应该是一个构造函数。

(2) 调用对象不存在的方法。以下的错误是因为变量**前面的那个变量是undefined/null。

URLError（URL错误）

URIError是URI相关函数的参数不正确时抛出的错误，主要涉及encodeURI()、decodeURI()、encodeURIComponent()、decodeURIComponent()、escape()和unescape()这六个函数。这些API的使用太少了，因此这种错误在我们日常开发中很少遇到。

EvalError（eval错误）

eval函数没有被正确执行时，会抛出EvalError错误。该错误类型已经不再在ES5中出现了，只是为了保证与以前代码兼容，才继续保留。因此这种错误在我们日常开发中也基本不会遇到。

Error（基类型）

Error 是基类型，其他六种错误类型都继承自该类型。因此，所有错误类型共享了一组相同的属性（错误对象中的方法全是默认的对象方法）。 Error 类型的错误很少见，如果有也是浏览器抛出的；这个基类型的主要目的是供开发人员抛出自定义错误。如下：

3.逻辑错误 -- 三种常见的错误情况

类型转换错误

类型转换错误发生在使用某个操作符，或者使用其他可能会自动转换值的数据类型的语言结构时。在使用相等（==）和不相等（!=）操作符，或者在 if 、 for 及 while 等流控制语句中使用非布尔值时，最常发生类型转换错误。

因此建议使用全等（===）和不全等（!==）操作符，以避免类型转换。

alert(5 == "5"); //true
alert(5 === "5"); //false
alert(1 == true); //true
alert(1 === true); //false复制代码

数据类型错误

JavaScript 是松散类型的，也就是说，在使用变量和函数参数之前，不会对它们进行比较以确保它们的数据类型正确。为了保证不会发生数据类型错误，只能依靠开发人员编写适当的数据类型检测代码。建议大家可以学习使用typescript，它是一种强类型的语言，可以设置变量的具体类型，在前端开发中使用会极大的减少我们开发的bug，并且方便维护。

function getQueryString (url) {
  if (typeof url == "string") { // 通过检查类型确保安全
    let pos = url.indexOf("?")
    if (pos > -1) {
      return url.substring(pos + 1)
    }
  }
  return ""
}

// 这个函数首先检查了传入的值是不是字符串。这样，就确保了函数不会因为接收到非字符串值而导致错误。
复制代码

通信错误

（1）ajax请求的地址url不正确：会报404的状态码，找不到页面

（2）发送的数据错误。会报400的状态码，一般为参数错误

4.浏览器的其他报错的情况

XMLHttpRequest cannot load http://***. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://***' is therefore not allowed access.

进行异步请求时，产生跨域了