web-dev-qa-db-ja.com

Object.entriesのBabelサポート

Object.values/Object.entriesのステージ3の提案 を見ており、現在のJavaScriptプロジェクトでそれを使用したいと考えています。

ただし、それをサポートするBabelプリセットがあるかどうかはわかりません。上記にリンクされているGitHubリポジトリはステージ3の提案であると述べているため、それがbabel-preset-stage-3の一部であると想定しましたが、そうではないようです。

今日Object.entriesを使用できるBabelプリセット（またはプラグインもありますか）はありますか？

javascriptbabeljsecmascript-next
19
damd

babel を使用してインストール

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

Object.values/Object.entriesおよびその他の* ES20 **機能をサポートします。

モジュールによる推奨に従って、。babelrcを次のように構成します。

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

私がやったのはcore-jsそして、ファイルの先頭でこれを呼び出すだけです：

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

この製 Object.entries利用可能。 @FelixKlingへのクレジット。

10
damd

更新：

コメントに記載されているように、mapの代わりにreduce関数を使用すると、パフォーマンスを改善できます。

コードでは大文字と小文字が区別されることに注意してください（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;

使用法：

// 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