Pourquoi est-Objet.assign() nécessitent un polyfill lors de babel-chargeur est utilisé?

Je suis d'essayer d'utiliser Object.assign() dans l'ES6 web app compilé par Babel avec webpack, mais j'obtiens une erreur:

Uncaught TypeError: Object.assign is not a function

Je suis déjà en utilisant babel-chargeur à transpile ES6 à l'ES5, de sorte que tous mes autres ES6 code de travail. Pourtant, Object.assign() ne fonctionne qu'après j'ai aussi import "babel-core/polyfill" dans ma base de code. Je vois que je peux aussi corriger ce par l'importation de babel-runtime, mais je voudrais comprendre pourquoi Object.assign() exige plus que ce babel-loader effectue, — ne pas babel-loader prétraitement de tout, y compris Object.assign()?

  • Juste une note pour les futurs lecteurs: le polyfill, appelée "babel-core/polyfill" au moment où cette question a été écrit, c'est maintenant "babel-polyfill", par la doc.
  • Qui est maintenant juste @babel/polyfill en v7.
InformationsquelleAutor Collin Allen | 2015-08-21
  1. 55

    Babel, via babel-loader, transpiles différences dans l'ES6 syntaxe. Babel sur sa propre n'a absolument rien à ajouter, dans l'ES6 bibliothèque standard de fonctionnalités (comme Object.assign). Chargement de la polyfill des charges distinct polyfill base-js pour vous, mais vous pouvez charger n'importe polyfill vous le souhaitez.

    Même certains de la syntaxe des conversions dépendent de certains polyfill de la fonctionnalité des charges, puisque certains de la syntaxe s'appuie sur des algorithmes et des comportements mis en œuvre dans le code de bibliothèque. L'ES6 fonctionnalités sur http://babeljs.io/docs/learn-es2015/ chaque liste de ce que la bibliothèque standard les fonctionnalités sont supposés avoir été chargé.

    InformationsquelleAutor loganfsmyth
  2. 12

    Object.assign() est une nouvelle API qui fait partie de l'ES6 spec, il n'est donc pas mis en œuvre dans la plupart des navigateurs encore. Voir: https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/assign

    Ainsi, lorsque vous importez babel-core/polyfill, il ajoute polyfills pour cela, et d'autres nouvelles Api, de sorte que votre ES6 code peut les utiliser.

    babel-loader est juste le transpiler qui convertit ES6 syntaxe à l'ES5 du code compatible.

    InformationsquelleAutor Breno Ferreira
  3. 9

    Si vous allez vers le bas de Compatibilité, vous pouvez voir IE 11 n'est pas pris en charge à la fois Web et Mobile pour l'objet.attribuer. Il vous donne également la pollyfill pour que.

    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;
  };
 }

    Si l'utilisation de Babel

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

    Si l'aide de MNP

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

    InformationsquelleAutor Velu S Gautam
  4. 1

    J'ai connu le même problème. J'ai pensé que je suis sûr à utiliser tous les ES2015+ featues quand elle est soutenue par babel. Mais comme il a été mentionné ci-dessus, babel polyfills seulement la syntaxe, pas de fonctions (de l'Objet.céder, Tableau.comprend pour n'en nommer que quelques-uns).
    Pour L'Objet.assigner je préfère ne pas utiliser de polyfill, mais l'utilisation de la propagation de l'opérateur. Dans ce cas babel fait polyfills Objet.attribuer si elle ne trouve pas. Regardez ce code:

    let obj = {a: 1};
let obj2 = {...obj};
let obj3 = Object.assign({}, obj);

    Il sera tranpiled par babel à:

    "use strict";

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

var obj = { a: 1 };
var obj2 = _extends({}, obj);
var obj3 = Object.assign({}, obj);

    Pour la propagation de l'opérateur babel tente d'utiliser l'Objet natif.méthode d'assignation et à l'utilisation polyfill si elle n'a pas été trouvé.
    Mais l'Objet explicite.attribuer la méthode reste inchangée \_(ツ)_/

    InformationsquelleAutor Eugene Karataev