web-dev-qa-db-fra.com

Prise en charge de Babel pour Object.entries

Je regarde la proposition de l'étape 3 d'Object.values ​​/ Object.entries et j'aimerais vraiment l'utiliser dans mon projet JavaScript actuel.

Cependant, je ne peux pas déterminer s'il existe un préréglage Babel qui le prend en charge. Étant donné que le référentiel GitHub lié ci-dessus dit que c'est une proposition de l'étape 3, j'ai supposé qu'il ferait partie de babel-preset-stage-3, mais il ne semble pas.

Existe-t-il un préréglage Babel (ou même un plugin?) Qui me permet d'utiliser Object.entries aujourd'hui?

javascriptbabeljsecmascript-next
19
damd

Utilisation de babel , installation

  1. babel-preset-env
  2. babel-plugin-transform-runtime

donne un support pour Object.values/Object.entries ainsi que d'autres fonctionnalités * ES20 **.

Selon la recommandation des modules, configurez . Babelrc avec ce qui suit:

{
  "plugins": ["transform-runtime"],
  "presets": ["env"]
}
28
petersv

Ce que j'ai fait, c'est installer core-js puis appelez cela en haut de mon fichier:

require('core-js/fn/object/entries');

Cela fait Object.entries disponible. Crédits à @FelixKling.

10
damd

Mise à jour:

Comme indiqué dans les commentaires, vous pouvez améliorer les performances en utilisant la fonction map au lieu de reduce.

Veuillez noter que le code est sensible à la casse (object != Object).

// Object.values

var objectToValuesPolyfill = function(object) {
    return Object
             .keys(object)
             .map(
                  function(key) {
                    return object[key];
                  }
              );
}

Object.values = Object.values || objectToValuesPolyfill;

// Object.entries

var objectToEntriesPolyfill = function(object) {
    return Object
             .keys(object)
             .map(
                  function(key) {
                    return [key, object[key]];
                  }
              );
}

Object.entries = Object.entries || objectToEntriesPolyfill;

Usage:

// es6

Object.values = Object.values || (x => Object.keys(x).map(k => x[k]));
Object.entries = Object.entries || (x => Object.keys(x).map(k => [k, x[k]]));

// es5

Object.values = Object.values || function(x){ 
    return Object.keys(x).map(function(k){ 
        return x[k];
    })
};

Object.entries = Object.values || function(x){ 
    return Object.keys(x).map(function(k){ 
        return [k, x[k]];
    })
};


const a = {
  key: "value",
  bool: true,
  num: 123
}

console.log(
  Object.values(a)
)

console.log(
  Object.entries(a)
)
5
Randy