Alternative Version für Object.values ​​()

78

Ich suche eine alternative Version für die Object.values()Funktion.
Wie hier beschrieben, wird die Funktion im Internet Explorer nicht unterstützt.

Bei der Ausführung des folgenden Beispielcodes:

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

Es funktioniert sowohl in Firefox als auch in Chrome, löst jedoch in IE11 den folgenden Fehler aus:

Objekt unterstützt keine Eigenschafts- oder Methoden- "Werte"

Hier können Sie es testen: Geige .

Was wäre also eine schnelle Lösung?

user1170330
quelle

Antworten:

177

Sie können ein Array von Schlüsseln mit abrufen Object.keys()und dann map()zum Abrufen von Werten verwenden.

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

console.log(values)

Mit ES6 können Sie dies mit Pfeilfunktionen in eine Zeile schreiben.

var values = Object.keys(obj).map(e => obj[e])
Nenad Vracar
quelle
2
Vielen Dank! Für meinen Winkel 5 Code habe ich objectValues = Object.values;zuobjectValues = ((obj) => { return Object.keys(obj).map(e => obj[e]); });
Jeff
@ Jeff, warum schaust du dir nicht eckige Polyfills an?
Saksham
angle8 polyfill.ts:import 'core-js/es/object/values';
wutzebaer
21

Object.values ​​() ist Teil der ES8-Spezifikation (Juni 2017). Mit Cordova wurde mir klar, dass Android 5.0 Webview dies nicht unterstützt. Also habe ich Folgendes getan und die Polyfill-Funktion nur erstellt, wenn die Funktion nicht unterstützt wird:

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

Da Object eine ( nicht so ) aktuelle Implementierung ist, müssen Sie Ihre eigene Funktion erstellen , wenn Sie alle Browser (AKA IE8 und niedriger) unterstützen möchten :

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

PS: Hab gerade den ecmascript-6Tag bemerkt . Übrigens behalte ich diese Antwort hier, nur für den Fall, dass jemand sie braucht.

Jorge Fuentes González
quelle
9

Wenn Sie bereits core-js verwenden (z. B. mit Angular), können Sie einfach die entsprechende Polyfüllung importieren:

   import 'core-js/es7/object';
Daniel Habenicht
quelle
Je nachdem, welche Version von Angular Sie verwenden, müssen Sie möglicherweise Ihren Import ändern: import 'core-js / es / object';
Mark Thompson
7

Sie können eine Polyfüllung verwenden:

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

Alex Pánek
quelle
4

Für Benutzer von UnderscoreJS können Sie Objektwerte abrufen , indem Sie Folgendes verwenden _.values:

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

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>

Aamin Khan
quelle
2
Es ist keine Prototypmethode.
Bergi
0

Ich weiß, dass es ein altes Thema ist. Ich habe herumgespielt und möchte nur eine weitere Implementierung hinzufügen. Es ist einfach die Kartenversion, bei der die Karte selbst mit einer Reduzierung implementiert ist:

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

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

console.log(valueArray);

Es macht den Job, aber es hat etwas, das mich stört. Die Reduzierungsfunktion verwendet obj und das obj wurde nicht darin injiziert . Wir sollten globale Variablen innerhalb von Funktionen vermeiden und unsere Funktionen testbarer machen . Daher bevorzuge ich diese Version mit einem Reduzierungsfunktions-Helfer , der das obj als Parameter verwendet und die tatsächliche Reduzierungsfunktion zurückgibt . Es wird:

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

Novy
quelle
0

Der beste Weg ist, es durch die Wertemethode von ramda zu ersetzen:

import * as R from 'ramda';

const obj = { foo: 'bar', test: 10 };

console.log(R.values(obj)) // ['bar', 10]

Plxmax
quelle
-1

Da ich keine Antwort auf meine Bedürfnisse gefunden habe:

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


console.log(obj[Object.keys(obj)[0]]) // bar

console.log(obj[Object.keys(obj)[1]])  // 42

Nutzung der Möglichkeit von Objekten, diese pro Literal zu adressieren.

Frank34
quelle
Keine Antwort mein Freund
Fluidguid
@fluidguid: danke für den Kommentar, es ist meine erste Antwort, ich muss lernen. Warum? Ich dachte, das Problem ist, die Werte eines Objekts im IE zu erhalten. Also, mit zB einem einfachen "für" habe ich sie. Was ist falsch?
Frank34
-1

Sie können ein Array von Schlüsseln mit Object.keys () abrufen. Dies funktioniert auch im IE. Object.values ​​() ist überhaupt nicht erforderlich, um Werte abzurufen, da wir die von Object.keys () erhaltenen Schlüssel verwenden können, um Werte wie folgt abzurufen:

var obj = { foo: 'bar', baz: 42 };
var keyArray = Object.keys(obj);
for(var i = 0; i < keyArray.length; i++)
    console.log(obj[keyArray[i]]); 
Sudhakar Dhayalan
quelle
1
Sie glauben wirklich, dass dies eine gute Lösung für Object.values ​​ist ????
Bootscodierer