【JavaScript】オブジェクトのプロパティを取得する方法

こんにちは！CodeClub965のKです！

今回は、JavaScriptでオブジェクトが持つ全てのプロパティを取得する方法について紹介しようと思います。

JavaScriptにおけるオブジェクトについて知りたい方は、下の記事で解説していますので、ぜひ読んでみてください！

オブジェクトのプロパティを取得する方法としてよく使われるものとして、「Object.keys()」、「forEach()」、「for...in」があります。

順番にコード例と一緒に解説します。

Object.keys()で取得する

Object.keys()は、引数に任意のオブジェクトを指定することで、持っている全てのプロパティを取得できます。

const obj = {
    a : 'code',
    b : 'club',
    c : '965'
}

var result = Object.keys(obj);
console.log(result);

■実行結果

[ 'a', 'b', 'c' ]

上の例では、「Object.keys()」の引数に「obj」を指定することで全てのプロパティを取得していることが分かります。

また、戻り値は「配列」で返ってきます。

forEach()を使って取得する

forEach()メソッドでも取得可能ですが、このメソッドは「配列」に対して利用できるメソッドです。
そのため、このままオブジェクトには使えませんので気をつけてください。

ではどうしたらいいか？となりますが、先ほどの「Object.keys()」を使うことで取得することができます。

なぜかというと、「Object.keys()」の戻り値は、配列だからです。
なので、それを利用して取得します。

const obj = {
  a: 'code',
  b: 'club',
  c: '965'
}

Object.keys(obj).forEach(function (value) {
  console.log(value);
});

■実行結果

a
b
c

Object.keys()とforEach()を使うことで対象のオブジェクトのプロパティを取得できていますね。

オブジェクトのプロパティを配列化して、forEach()で1つずつログ出力しているだけです。

for...inを使って取得する

for..in は、for文のようにオブジェクトのプロパティを1つずつループで取得する方法になります。

例を見た方が早いのでコード例を見てみましょう。

const obj = {
  a: 'code',
  b: 'club',
  c: '965'
}

for (let key in obj) {
  console.log(key);
}

■実行結果

a
b
c

上の例では、オブジェクトの「obj」に対して、プロパティを1つずつ「key」という値に代入してログ出力しています。

特に難しくはないですね。

最後に

いかがでしたでしょうか？
今回は詳しく説明するというより、方法としてどんなものがあるか紹介してみました。

自分の中での選択肢を広げる意味でも知っておくと便利です。

それぞれのメソッドについては、詳しく説明していないのでもっと踏み込んだ解説はまた別の記事で書きたいと思います。

それでは、また！

Follow me!