【解説】JavaScriptのObject.keys／values／entries【使い方】

記事内に広告を含みます

JavaScriptのObjectで使える下記メソッドを解説していきます。

・Object.keys

・Object.values

・Object.entries

順に見ていきましょう。

「Object.keys」を使えば、オブジェクトの中のプロパティを配列として取得することができます。

書き方がこちら。

Object.keys(オブジェクト名);

例として下記コードを書いた結果の出力がこちら。

const apple = {
  name: 'りんご',
  color: '赤色',
  num: 3,
};


console.log(Object.keys(apple));

(3) ['name', 'color', 'num']

appleというオブジェクトのキーを、配列で取得することができました。

配列として取得することができるので、オブジェクトを「for of」のループで活用することができます。

for(const key of Object.keys(apple)) {
  console.log(key);
}

forEachで回すことも可能ですね！

Object.keys(apple).forEach((key) => {
  console.log(key);
});

「Object.values」を使えば、オブジェクトの中の値を配列として取得することができます。

書き方がこちら。

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

例として下記コードを実装して出力した結果がこちら。

const apple = {
  name: 'りんご',
  color: '赤色',
  num: 3,
};


console.log(Object.values(apple));

(3) ['りんご', '赤色', 3]

「Object.entries」を使えば、オブジェクトの中のキーと値をセットとした配列を、配列で取得することができます。

書き方がこちら。

Object.entries(オブジェクト名);

例として下記コードを実行した結果がこちら。

const apple = {
  name: 'りんご',
  color: '赤色',
  num: 3,
};


console.log(Object.entries(apple));

0 : (2) ['name', 'りんご']
1 : (2) ['color', '赤色']
2 : (2) ['num', 3]

キーと値が配列になったものが、配列として出力されていますね。

【解説】JavaScriptのObject.keys／values／entries【使い方】：まとめ

ジト

オブジェクトのキーや値を配列として使いたい時はためしてみてね！