为什么在使用babel-loader的时候Object.assign()需要一个polyfill?

我正在尝试在由webpack编译的Babel编译的ES6 Web应用程序中使用Object.assign() ,但是出现错误:

 Uncaught TypeError: Object.assign is not a function 

我已经使用babel-loader将ES6转换为ES5,所以我所有的其他ES6代码都可以正常工作。 然而, Object.assign()只在我的代码库中import "babel-core/polyfill"之后才起作用。 我看到我也可以通过导入babel-runtime来解决这个问题,但是我想知道为什么 Object.assign()需要比babel-loader执行 – 不应该使用babel-loader预处理所有东西,包括Object.assign()

Babel通过babel-loader解释ES6 语法的差异。 Babel本身在ES6标准库function(如Object.assign )中完全没有添加任何东西。 加载polyfill会为您加载一个单独的polyfill core-js ,但是您可以加载所需的任何polyfill。

甚至一些语法转换依赖于特定的polyfillfunction来加载,因为一些语法依赖于在库代码中实现的algorithm和行为。 http://babeljs.io/docs/learn-es2015/上的ES6function列出了哪些标准库function被假定为已经加载。

Object.assign()是一个新的API,是ES6规范的一部分,所以它在大多数浏览器中都没有实现。 请参阅: https : //developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/assign

所以当你导入babel-core/polyfill ,它会添加polyfills和其他新的API,以便你的ES6代码可以使用它们。

babel-loader只是将ES6语法转换成ES5兼容代码的转换babel-loader

如果你去兼容性,你可以看到IE 11不支持Web和移动object.assign。 它也给你这个pollyfill。

https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/assign

 if (typeof Object.assign != 'function') { Object.assign = function(target, varArgs) { 'use strict'; if (target == null) { // TypeError if undefined or null throw new TypeError('Cannot convert undefined or null to object'); } var to = Object(target); for (var index = 1; index < arguments.length; index++) { var nextSource = arguments[index]; if (nextSource != null) { // Skip over if undefined or null for (var nextKey in nextSource) { // Avoid bugs when hasOwnProperty is shadowed if (Object.prototype.hasOwnProperty.call(nextSource, nextKey)) { to[nextKey] = nextSource[nextKey]; } } } } return to; }; } 

如果使用Babel

https://babeljs.io/docs/plugins/transform-object-assign/

如果使用NPM

https://www.npmjs.com/package/object-assign