ReferenceError和TypeError有什么区别？

在前端开发中，ReferenceError 和 TypeError 都是常见的 JavaScript 错误，但它们表示不同的问题：

ReferenceError:

• 含义: 当你尝试访问一个未声明或未初始化的变量时，就会抛出 ReferenceError。 也就是说，JavaScript 引擎无法在当前作用域或任何父作用域中找到你引用的变量。

• 常见场景:

  • 拼写错误：例如，console.log(myVarible); // 拼写错误，应该是 myVariable
  • 作用域问题：在一个函数内部尝试访问外部未声明的变量。
  • 使用已删除的变量：例如，使用了 delete 操作符删除了变量，之后又尝试访问它。
  • 访问未定义的属性：例如，const obj = {}; console.log(obj.nonExistentProperty);

TypeError:

• 含义: 当你对一个变量执行的操作与其数据类型不兼容时，就会抛出 TypeError。 也就是说，你尝试对一个值执行一个它不支持的操作。

• 常见场景:

  • 对非函数调用 ()：例如，const myVar = 10; myVar(); // 尝试调用一个数字
  • 访问 null 或 undefined 的属性：例如，const myVar = null; console.log(myVar.someProperty);
  • 对非对象使用类似数组的操作：例如，const myVar = 10; myVar.length; // 尝试获取数字的长度
  • 传递不正确的参数类型给函数：例如，一个函数期望一个数字，但你传递了一个字符串。

总结：

错误类型	原因
ReferenceError	尝试访问不存在的变量
TypeError	对变量执行了与其类型不兼容的操作

示例:

// ReferenceError
console.log(undeclaredVariable); // ReferenceError: undeclaredVariable is not defined

// TypeError
const num = 10;
num.toUpperCase(); // TypeError: num.toUpperCase is not a function

const obj = null;
console.log(obj.property); // TypeError: Cannot read properties of null (reading 'property')

通过理解这两种错误类型的区别，你可以更有效地调试 JavaScript 代码，并更快地找到问题的根源。