オブジェクトとは
オブジェクトとはJavaScriptのデータ型の一つです。データ型について知りたい方はこちらの記事をご覧ください。
オブジェクト(Object)の特徴はキーと値を持つことです。キーと値の組み合わせをプロパティと呼びます。値には文字列や数値はもちろん、配列やオブジェクト、関数も設定できます。そのため、入れ子になっていることが多いです。
キーと値を書くときは「name:’masa’」のように書きます。このnameがキーであり、’masa’が値になります。キー名は自由に設定できますので、値がわかりやすい名前を付けることをおすすめします。
オブジェクトは初心者の方など慣れないと戸惑うと思いますが、その分使いこなせるとできることが多くなり複雑な実装でも対応できるようになります。事前に学習して慣れておきましょう。
オブジェクトの使い方
宣言
オブジェクトを使用するときは初期値に{}を指定して宣言します。
var foo = {};プロパティの追加
プロパティを追加する方法は２種類の書き方があります。
var person = {};
//１つ目：ドットで指定する
person.name = 'masa';
//２つ目：[]で指定する
person['age'] = 20;活用術
オブジェクトを活用する方法をいくつかあげます。これからの例は以下の変数を使います。
var months = {
jan: '１月',
feb: '２月',
mar: '３月',
apr: '４月',
may: '５月',
jun: '６月'
};for文でプロパティの数だけ繰り返す
for文だと配列の場合では繰り返し回数を指定するのがよくある書き方ですが、オブジェクトの場合はプロパティの数だけ繰り返すことができます。
書き方はfor(var 一時的な変数名 in 繰り返すオブジェクト){}と書きます。取得できるのはキーですが、オブジェクト[key]で値は取り出せます。実際に書く場合このように書きます。
for(var key in months){
console.log(key);
console.log(months[key]);
}//コンソールの出力結果
jan
１月
feb
２月
mar
３月
apr
４月
may
５月
jun
６月プロパティは後から追加できるので、数を指定してしまうと動的に追加したときに全て繰り替えませんが、この書き方なら後からいくつプロパティを追加してもすべてに対して繰り替えされる利点があります。
キー、値をそれぞれ配列で取得する
キーや値を取得するときにプロパティが多いと個別に取得するのが大変です。これらを配列でまとめて取得するメソッドがあります。
Object.keys()とObject.values()を使用します。
//キーを配列で取得する
Object.keys(months);
//値を配列で取得する
Object.values(months);オブジェクトのコピー
オブジェクトを新しいオブジェクトにコピーできます。元のオブジェクトを変更したくない場合はコピーして、コピーしたオブジェクトを変更、追加をすることで元のオブジェクトはそのままにできます。
Object.assign()メソッドを使用します。引数は(コピー先,コピー元)です。
//copyにmonthsの内容をコピーする
var copy = Object.assign({}, months);JSON形式に変換
JSON形式に変換するとObjectだったものがJSON文字列として扱えるようになります。文字列しか渡せない場合や、JSONしか使えない場合に簡単に変換できます。
JSON.stringify(オブジェクト)メソッドを使用します。
//JSON文字列に変換する
var result = JSON.stringify(months);まとめ
冒頭でも言いましたが、オブジェクトは初めは頭を抱えると思います。しかし、慣れてくるといろんなデータをまとめることができますし、複雑な処理でも自分で作成できるようになります。それだけJavaScriptではオブジェクトが重要となっています。
サイトや参考書を読んでいるだけでは理解するのは大変です。実際にオブジェクトを使ってプログラムを書いてみるといいと思います。
