web-dev-qa-db-ja.com

Object.values（）の代替バージョン

Object.values()関数の代替バージョンを探しています。
As ここで説明 この機能はInternet Explorerではサポートされていません。

次のサンプルコードを実行する場合：

var obj = { foo: 'bar', baz: 42 };
console.log(Object.values(obj)); // ['bar', 42]

FirefoxとChromeの両方で動作しますが、IE11で次のエラーをスローします。

オブジェクトはプロパティまたはメソッド「値」をサポートしていません

ここでテストできます： Fiddle 。

それで、簡単な修正は何でしょうか？

javascriptinternet-explorerbrowserecmascript-6
49
user1170330

Object.keys()を使用してキーの配列を取得し、map()を使用して値を取得できます。

var obj = { foo: 'bar', baz: 42 };
var values = Object.keys(obj).map(function(e) {
  return obj[e]
})

console.log(values)

ES6では、矢印関数を使用してこれを1行で記述できます。

var values = Object.keys(obj).map(e => obj[e])
131
Nenad Vracar

Object.values（）は、ES8（2017年6月）仕様の一部です。 Cordovaを使用して、Android 5.0 Webviewではサポートされていないことに気付きました。そのため、この機能がサポートされていない場合にのみポリフィル関数を作成して、次のことを行いました。

if (!Object.values) Object.values = o=>Object.keys(o).map(k=>o[k]);
13
Chong Lip Phang

Objectは（not so）最近の実装であるため、allブラウザ（別名IE8以下）をサポートする場合は、独自の関数を作成する必要があります。

function objectValues(obj) {
    var res = [];
    for (var i in obj) {
        if (obj.hasOwnProperty(i)) {
            res.Push(obj[i]);
        }
    }
    return res;
}

PS：ecmascript-6タグに気付きました。ところで、誰かがそれを必要とする場合のために、私はこの答えをここに保管します。

12
Jorge Fuentes González

ポリフィルを使用できます：

const valuesPolyfill = function values (object) {
  return Object.keys(object).map(key => object[key]);
};

const values = Object.values || valuesPolyfill;

console.log(values({ a: 1, b: 2, c: 3 }));
5
Alex Pánek

既に core-js を使用している場合（たとえば、Angularを使用して）、対応するポリフィルをインポートできます。

   import 'core-js/es7/object';
3
Daniel Habenicht
var x = {Name: 'John', Age: 30, City: 'Bangalore'};
 
Object.prototype.values = function(obj) {
                                var res = [];
    for (var i in obj) {
        if (obj.hasOwnProperty(i)) {
            res.Push(obj[i]);
        }
    }
    return res;
};
 
document.getElementById("tag").innerHTML = Object.values(x)
<p id="tag"></p>
2
Aamin Khan

nderscoreJS を使用している場合、_.valuesを使用してオブジェクト値を取得できます。

var obj = { foo: 'bar', baz: 42 };
console.log(_.values(obj)); // ['bar', 42]
1
Antikhippe

私はそれが古いトピックであることを知っています。私は周りで遊んでいて、別の実装を追加したいだけです。それは単にマップ自体がreduceで実装されたマップバージョンです：

let obj = { foo: 'bar', baz: 42 };

const valueArray = Object.keys(obj).reduce((acc, key) => {
  acc.Push(obj[key]);
  return acc;
}, []);

console.log(valueArray);

それは仕事をしますが、それは私を悩ます何かを持っています。レデューサー関数はobjを使用し、objはその中にinjectedではありませんでした。関数内でglobal variableを避け、関数をより多くtestableにする必要があります。そのため、このバージョンではreducer function helperを使用し、objをパラメーターとして取り、actual reducer functionを返します。あれは。。。になる：

let obj = { foo: 'bar', baz: 42 };

// reducer function helper take obj and return the actual reducer function
let reducerFuncHelper= obj => (acc, key) => {
  acc.Push(obj[key]);
  return acc;
}
//much better
const valueArray = Object.keys(obj).reduce(reducerFuncHelper(obj), []);
console.log(valueArray);
0
Novy