javascript - 为什么当我使用 babel 将 ES6 编译为 ES5 时,浏览器需要一个 polyfills 文件

标签 javascript browser ecmascript-6 babeljs

如果 babel 将 ES6 翻译为 ES5 并输出 ES5 文件,那么如果应用程序输出文件完全包含 ES5 代码,为什么浏览器需要包含 polyfill 文件?

最佳答案

Babel 将 ES6(及更新版本)代码转换为 ES5 代码。例如,它将箭头函数 (() => {}) 重写为 ES5 函数 (function() {})。然而,ES6 不仅仅是一些新语法。

https://babeljs.io :

Since Babel only transforms syntax (like arrow functions), you can use babel-polyfill in order to support new globals such as Promise or new native methods like String.padStart (left-pad). It uses core-js and regenerator. Check out our babel-polyfill docs for more info.

所有新功能都需要使用polyfill 来实现。这些 Polyfill 必须全局包含到您的项目中。否则,ES6 函数的每次使用都将被 ES5 代码中该函数的实现所取代。所以如果你使用例如Array#findIndex 十次,转译代码也将包含十次实现。这就是为什么 Polyfill 必须全局添加,而不仅仅是通过转译步骤添加。

关于javascript - 为什么当我使用 babel 将 ES6 编译为 ES5 时,浏览器需要一个 polyfills 文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40524010/

相关文章:

javascript - 如何在加载时或需要时使页面全屏显示

javascript - Jquery onchange 事件未触发

java - 是否可以在没有浏览器的情况下在Google广告中实现oauth2身份验证?

javascript - 如何在 React 中将裁剪参数设置为原始图像?

c# - 如何阻止回发在客户端刷新页面

javascript - 如何更改关于 GSnewsBar 对象(Ajax API)的 'Google News' 的语言?

javascript - 在浏览器的特定窗口中打开多个选项卡?

browser - 是否可以通过浏览器在 github 中的某处创建文件?

javascript - flatMap 在 yarn 测试 JavaScript 中不起作用

javascript - CasperJS/PhantomJS ES6 Promise Polyfill