オブジェクトを使ってみよう

今回は、オブジェクトの使い方を解説していきます。

オブジェクトの使い方

const object = {
    name: 'tanaka',
    age: 12,
    gender: 'man'
}

console.log(object.name);

コンソールを確認すると、tanakaが表示されます。

const object = {}の形でオブジェクトになります。配列は角括弧[]でしたが、オブジェクトは波括弧{}です。

name: 'tanaka'のnameはキー、’tanaka’は値と言います。

object.nameですが、この形は以前やりました。プロパティですね。

オブジェクトの値は、オブジェクト.プロパティ名の形で取り出すことができます。

プロパティ名にはキーが入ります。

また、以下のような取得方法もできます。

const object = {
    name: 'tanaka',
    age: 12,
    gender: 'man'
}

console.log(object['name']);

キーは、クォーテーションやダブルクォーテーションがついた形にもできます。

const object = {
    'name': 'tanaka',
    'age': 12,
    'gender': 'man'
}

console.log(object.name);

クォーテーションやダブルクォーテーションは省略する方が多いですが、キーにハイフン（-）を使いたい時にはクォーテーションやダブルクォーテーションが必要になります。

const object = {
    'key-name': 'value',
}

以下のように書くと、エラーになります。

const object = {
    key-name: 'value',
}

オブジェクトのループ

オブジェクトの数だけループを行う方法を解説します。

script.jsを以下のように書き換えてください。

const object = {
    name: 'tanaka',
    age: 12,
    gender: 'man'
}

for(const prop in object) {
    console.log(prop + 'の値は、' + object[prop]);
}

コンソールを確認すると、キーと値がセットで取得できたのが確認できます。

for(const 定数名 in オブジェクト)の形で、オブジェクトの形でループできます。

この定数の中には、キーが入ります。