什么是延伸的错误？
在前端开发中，我们常常会遇到一些比较难以理解或者不易于查找的错误。其中有一种错误被称为“延伸的错误”（extended errors），指的是 JavaScript 在执行代码时，由于某些原因导致的意外行为或错误信息。
这些错误通常会出现在语法错误、ES6 的新特性使用不当等情况下，它们可能不会在编译时报错，而是在运行时才会暴露出来。
语法错误
在 JavaScript 中，语法错误（syntax errors）通常是由于代码中存在语法错误，导致 JavaScript 引擎无法正确解析代码而报错。例如，下面的代码就存在语法错误：
--- - - --- -- -- -------------- -- - ----------------- --
这段代码中，forEach 后面应该跟着一个大括号，但是却少写了一个，所以会报出类似如下的错误：
------------ ------- - ------ -------- ----
这种错误通常很容易被发现和修复。但是在某些情况下，语法错误可能不容易被发现，例如使用 ES6 的新特性时。
ES6 新特性的错误
在 ES6 中，有很多新的特性，比如箭头函数、let 和 const 声明、模板字符串等等。这些新特性让我们的代码更加简洁、易读。但是如果使用不当，也可能会导致延伸的错误。
一个常见的例子就是在使用箭头函数时，忘记了给参数加括号。例如下面的代码：
--- - - --- -- -- -------------- -- ------------------
这段代码中，箭头函数后面只有一个表达式，所以可以省略大括号和 return 关键字。但是如果我在参数上忘记了加括号，就会报出类似如下的错误：
------------ -------- ----------- --- ---
这个错误看起来很难理解，因为它并没有直接指出问题所在。但是仔细观察错误信息，我们可以发现是少了一个左括号。
除了语法错误之外，ES6 的新特性还会带来其他类型的错误，例如变量提升问题、作用域问题等等。所以，在使用 ES6 新特性时，一定要注意使用方式和限制条件，避免出现延伸的错误。
使用 Babel 解决 ES6 延伸错误
为了避免 ES6 的延伸错误，我们可以使用 Babel 进行转译。Babel 是一个 JavaScript 编译器，可以将 ES6 代码转译成 ES5 代码。这样就可以在不支持 ES6 的浏览器上运行代码，同时也可以避免一些延伸的错误。
我们可以使用 Babel CLI 来进行转译。首先需要安装 Babel CLI：
--- ------- ---------- ----------
然后创建一个 .babelrc 文件，配置需要转译的规则：
-
---------- -
-------------------
-
-最后，在命令行中执行转译命令：
--- ----- --- --------- ---
这个命令会将 src 目录下的所有文件转译成 ES5 的代码，并输出到 lib 目录下。如果有延伸的错误，Babel 会抛出相应的错误信息方便我们调试和排查问题。
总结
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/10675