JavaScriptのObject.values()を用いる方法

この記事では、JavaScriptのObject.values()を用いてオブジェクトの値を配列で返す方法や、
その配列に対してループ処理を加えたり値の有無を調べたりする方法について見ていきたいと思います。

Object.values()とは

Object.values()は、オブジェクトの値を配列にして返すメソッドです。

Object.values()の書き方

Object.values(オブジェクト名)

Object.values()の返り値

オブジェクトの値からなる配列

Object.values()の使用例

let object = {
  apple: "りんご", 
  banana: "バナナ",
  milk: "牛乳"
};

let values = Object.values(object);

console.log(values);

この例では、それぞれのオブジェクトの値が「リンゴ」「バナナ」「牛乳」になっているので、
これらからなる配列が返されるはずです。
結果を見てみると、

こうですね。
ちゃんとオブジェクトの値からなる配列が返されていますね。

Object.values()の返り値をループ処理する方法

Object.values()で生成された配列に対してループ処理を加えるにはforEach()などが使えます。

let object = {
  apple: "りんご", 
  banana: "バナナ",
  milk: "牛乳"
};

let values = Object.values(object);

values.forEach(element => {
  console.log(element);
});

この例ではObject.values()で生成された配列valuesにforEach()を用いて、
それぞれの要素をコンソールに出力するという内容になっています。
では結果を見てみると、

こうですね。
Object.values()で返された配列のそれぞれの要素がコンソールに出力されていますね。

some()を使って処理を加える方法

some()をObject.values()で返された配列に対して使うことで、オブジェクトの値にsome()で指定した条件を満たすものが含まれているかどうかを確認することができます。
では例を見ていきましょう。

let object = {
  apple: "りんご", 
  banana: "バナナ",
  milk: "牛乳"
};

let values = Object.values(object);

let result1 = values.some(element => element === "バナナ");
let result2 = values.some(element => element === "イチゴ");

console.log(result1);
console.log(result2);

ここでは、Object.values()で返された配列に「バナナ」が含まれているか、「イチゴ」が含まれているかをそれぞれ真偽値で返すという内容になっています。

なので、「バナナ」はオブジェクトの値に含まれているので「true」が、「イチゴ」は含まれていないので「false」が返されるはずです。

では結果を見てみると

こうですね。
ちゃんと条件を満たす値が存在するかどうかが真偽値で返されていますね。

まとめ

このように、Object.values()を用いることで、オブジェクトの値を配列で返すことができます。

また、オブジェクトのキーを配列で返したい場合は、Object.keys()を用いることができるので

合わせてご参照いただきたいと思います。