オブジェクトの書き方
オブジェクトは、constかletで変数の宣言をして、{ };（波括弧とセミコロン）とすることで定義します。
const 変数名 = {プロパティやメソッド}；
プロパティの書き方は、名前と値を「:」（コロン）で繋げます。
{名前: 値};
プロパティを複数持たせる場合は「,」（カンマ）で区切ります。
{名前: 値, 名前: 値};
1つのプロパティに値を複数持たせたい場合は配列を使います。
{名前: 値, 名前: [値, 値, 値]};
//1行で記述
const menu = {coffee: "450円", cake: "600円", "cake-set": "800円"};
//複数行で記述
const menu = {
coffee: "450円",
cake: "600円",
set: "800円"
};
データを1行で書いても複数行で書いても構いません。
オブジェクトは入れ子にすることもできます。また、あるプロパティに複数の値を格納する場合は配列を使います。
const menu = {
coffee: {
name: "コーヒー",
price: 450
},
cake: {
name: "ケーキ",
price: 600
},
set: {
name: "ケーキセット",
price: [700, 800, 900]
}
};
プロパティへのアクセス方法
プロパティにアクセスして、格納したデータを取り出したり、中の値を書き換えたりしますが、その時のアクセス方法には2種類あります。
1つ目は、
オブジェクト.プロパティ名
のように、「.」（ドット）でプロパティ名を繋げる書き方です。
2つ目は、
オブジェクト.["プロパティ名"]
のように、[ ]（各括弧）の中に、プロパティ名を文字列として書く方法です。
//ドットで繋げる
console.log(menu.set.price[1]);
//各括弧で囲む（配列の番号は後ろに続ける）
console.log(menu["set"]["price"][1]);
存在しないプロパティ名を書いてしまい、その値を得ようとした時、この場合はエラーにならず、「undefined」が得られます。
値の上書き、プロパティの追加・削除
オブジェクトに格納した値は上書きすることもできます。また、オブジェクトに新たにプロパティを追加することもできます。
const menu = {name: "コーヒー", price: 450}
menu.name = "カフェオレ"; //「name」の値を「カフェオレ」に上書き
console.log(menu.name); //「カフェオレ」と出力します
オブジェクト.プロパティ
としてプロパティにアクセスし、値を上書きします。
const menu = {name: "コーヒー", price: 450}
menu["name"] = "カフェオレ"; //「name」の値を「カフェオレ」に上書き
console.log(menu.name); //「カフェオレ」と出力します
オブジェクト["プロパティ"]
のアクセス方法でも上書きできます。
上書きと同じ要領でプロパティと値を新たに追加することができます。
const menu = {name: "コーヒー", price: 450}
menu.food = "パスタ"; //名前に「food」とその値に「パスタ」を追加
menu["food"] = "パスタ"; //角括弧を使った書き方
プロパティの削除にはdelete演算子を使います。
const menu = {name: "コーヒー", price: 450, food: "パスタ"}
delete menu.food; //プロパティ「food」とその値を削除