Object.values() Method
This week I'm tackling Object.values()
, which is fairly straightforward. When you run Object.values()
against a data object, the method returns an array of the object's property values.
const person = { name: "Joey", age: 31, occupation: "Web Developer", location: "Austin, Texas", hungry: true,};
const attributes = Object.values(person);console.log(attributes);// expected output:// ["Joey", 31, "Web Developer", "Austin, Texas", true]
The Object.values()
method gives us a way to unpack the contents of a box in an orderly fashion.
The above code produces the same result as this for...in loop
:
const attributesArray = [];
for (const attribute in person) { attributesArray.push(person[attribute]);}console.log(attributesArray);// expected output:// ["Joey", 31, "Web Developer", "Austin, Texas", true]
One little gotcha to be aware of is that if the keys are numeric, Object.values()
will output the items in the numeric order of the keys.
const obj = { 5: "Giraffe", 70: "Octopus", 17: "Lion", 1: "Armadillo", 0: "Puffin",};
const objValues = Object.values(obj);console.log(objValues);// expected output:// ["Puffin", "Armadillo", "Giraffe", "Lion", "Octopus"]
Lastly, if you run Object.values()
against a simple array, all you get is a copy of the array:
const colors = ["red", "orange", "yellow", "green", "blue", "violet"];
const objValues = Object.values(colors);console.log(objValues);// expected output:// ["red", "orange", "yellow", "green", "blue", "violet"]
From MDN: The Object.values()
method returns an array of a given object's own enumerable property values, in the same order as that provided by a for...in loop
(the difference being that a for...in loop
enumerates properties in the prototype chain as well).
See more examples and documentation here.