背景
ES6 是一种新的 JavaScript 语法标准，包括了箭头函数、let 和 const、解构赋值、模板字符串、类等多种特性，这些语法的引入大大提升了 JavaScript 的开发体验和开发效率。然而，由于 ES6 的新特性在一些旧版浏览器中不被支持，因此需要使用 Babel 等工具将 ES6 代码转换为 ES5 代码。
然而，当使用 Babel 编译 ES6 语法时，有时会遇到“数组未定义”的问题，这是因为 Babel 在编译时默认只包含了 ES6 的语法转译，而没有包含新标准中加入的全局对象的 polyfill。
解决方法
要解决“数组未定义”的问题，可以使用 Babel 提供的 @babel/polyfill 模块，该模块可以提供 ES5 环境下缺失的函数、方法等，从而避免在使用 ES6 中的某些语法时出现问题。
步骤
安装
@babel/polyfill模块--- ------- --------------- ------
在 JavaScript 代码的入口处引入
@babel/polyfill------ ------------------
或者，在 HTML 文件中添加以下代码
------- ----------------------------------------------------------
polyfill.io 可以根据用户的浏览器版本和需要的 polyfill 来动态生成 JavaScript 代码，因此不用担心加载过多不必要的代码。
示例代码
------ ------------------ ----- --- - ----- ---- ----- ------------------------------- -- ----
上述代码中，includes() 是 ES6 中新增的数组方法，如果没有引入 @babel/polyfill，在一些旧版浏览器中会出现“includes() 未定义”的问题。而引入了 @babel/polyfill 后，代码就可以在各种浏览器中正常运行。
思考
以上介绍的解决方法只是一个最基本的方法，而实际上还有很多更好的解决方法。另外，我们应该牢记使用新特性时需要考虑浏览器兼容性问题，并适当使用 polyfill 或者其他工具来解决问题。同时，也需要注意 polyfill 的引入数量和体积，不要添加过多的 polyfill 来增加加载时间和页面体积。
结论
本文介绍了如何在使用 Babel 编译 ES6 语法时解决“数组未定义”的问题，主要是通过使用 @babel/polyfill 模块引入 ES5 环境下缺失的函数、方法等来解决问题。这种方法是最基本的解决方法，同时也提醒了我们在使用新特性时需要考虑浏览器兼容性问题，并适当使用 polyfill 或者其他工具来解决问题。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/66ff52f5d7413cc7552ab68d