Javascript

Object.keys()を使ってみよう

Object.keys()を使って、オブジェクトのプロパティ一つひとつに対して処理をする方法と、配列の中にオブジェクトを入れる方法について見ていきます。

  • Object.keys()
  • 配列とオブジェクトの組み合わせ

Object.keys()

・今回はオブジェクトのプロパティをすべて表示するようにプログラムを書いていきましょう。

・ただオブジェクトには forEach() が使えません。なのでまずはオブジェクトを配列に直していきます。

・Object.keysを使って、まずは配列を取得していきます。

・Object.keys(point) とすると point の全てのキーを配列で取得できるので、それをkeys という定数に入れてあげます。const keys = Object.keys(point);と書いていけば変数に入れることができますね。

・そうするとキーが配列で取得できて、配列には forEach() が使えるので、それを使って表示をしていきます。

・ keys.forEach(key =>{});とすることですべての要素に処理をすることが出来ます。あとはコンソールで表示してあげればいいので {}の中でconsole.log(`key: ${key} Value: ${point[key]}`);としてあげます。

配列とオブジェクトの組み合わせ

・配列やオブジェクトは自由に組み合わせて複雑なデータ構造を作ることもできます。

・例えば、複数の座標を管理したかった場合、まず points という配列を作って、その中に要素として複数のオブジェクトを入れています。配列は[]で書いていきプロパティは{}を使って作っていきます。

・値へのアクセス方法ですが、値を取り出したい場合、console.log(points[1].y);とするとpoints 1 番目のyを取得します。

-Javascript