備忘録的プログラミングリファレンス

オブジェクト

 JavaScript でオブジェクトを変数として宣言するには以下のように連想配列を使用します。

オブジェクトの作成
let object_ = {};

 上記は object_ はオブジェクトを扱う変数として宣言しています。中身はなく、空のオブジェクトです。

 オブジェクトは Object 型と呼ばれます。

オブジェクトコンストラクター
let example = new Object();

 Object は連想配列でもあります。

 JavaScript では、オブジェクトとはプロパティ、メソッドなどが定義された連想配列型データをいいます。

 多くの場合はオブジェクトはクラスから生成されます。
 クラスから生成されたオブジェクトデータはインスタンスと呼ばれます。解説の都合上 JavaScript ではオブジェクトとも呼ばれます。

 オブジェクトは物体や事象を表しオブジェクト指向によって提唱されました。
 提唱されたオブジェクトデータと関数の組み合わせたオブジェクトでは違いがあるためにプログラム上ではオブジェクトをインスタンスと呼びます。

ページ内 Index

オブジェクトの作成

 オブジェクトを変数として宣言するには以下のようにします。

オブジェクトの変数宣言
let obj_student = {};

 これだけでは obj_student は空の状態ですが、オブジェクトにはデータや関数を後で追加することができます。

 名前(name)、年齢(age)、クラス名(class_name) というデータを加えてみます。

プロパティの追加
obj_student.name = "sam";
obj_student.age = 10;
obj_student.class_name = "B";

 このことによって名前、年齢、クラス名というプロパティが追加されました。同じ容量でメソッドも追加することができます。

連想配列

 Object 型は連想配列でもあります。連想配列の key とvalue の組み合わせの編集方法で上記の例を作成することもできます。

プロパティの追加
let obj_student = {
	name:"sam",
	age:10,
	class_name:"B"
};

 連想配列については連想配列型( Object )で解説しています。オブジェクトの扱いと共通しますので参照してみてください。

 オブジェクトは生徒の名簿として使えそうです。しかし、これではデータごとに変数宣言から始めなければなりません。JavaScript にはクラス宣言を使うことによって同じような形式のオブジェクトを複製することができます。

プロパティについて

 オブジェクトはプロパティとメソッドを持つことができます。
 プロパティはオブジェクトを表す変数で、メソッドは主に変数を操作するための関数です。

 プロパティは変数名(識別子)とその値の組み合わせです。キーと値と言ったりもします。プロパティの順番は決まっていません。

 プロパティは以下のようにオブジェクトの後に.または[ ]を使って指定します。

プロパティの値を取得
console.log( obj_student.name );
// または
console.log( obj_student['name'] );

 このことは連想配列に準じています。

 プロパティにはプロパティ自体を操作するための Object.defineProperty()Object.getOwnPropertyDescriptor() といったメソッドがあります。
 ディスクリプタの操作によって、プロパティの変更、列挙型、削除といった既定の性質を変更することができます。

 オブジェクトのプロパティとメソッドについては連想配列型( Object )ページを参照してください。

クラス

 JavaScript では class キーワードを使用してクラスを定義できます。クラスはオブジェクトのひな型のようなもので、同じような形式のオブジェクトを複数作成することができます。

クラス定義
class Example{
	constructor(){

	}
}

 このように宣言すれば、Example クラスが定義できました。constructor() はコンスラクターといいオブジェクトを生成するための関数です。

 このひな型からオブジェクトを生成するには以下のようにします。new キーワードでオブジェクトを生成しようとすると、まずは constructor() を呼び出します。

クラスからオブジェクトの生成
const example_a = new Example();
const example_b = new Example();

 クラス定義から同じひな型を使ったオブジェクトが example_a、example_b と複数できました。(ただし、この例ではクラスの中身がないので、作成されるオブジェクトも中身はありません。)

 クラスから生成されたオブジェクトは正式にはインスタンスといいます。

 例えば、上記のオブジェクトの作成 obj_student をクラスで作成してみます。

生徒データのクラス
class Student{
	constructor( name, age, class_name ){
		this.name = name;
		this.age = age;
		this.class_name = class_name;
	}
}

 この生徒データconstructor(

生徒データの作成
const student_01 = new Student("same", 10, "B");
const student_02 = new Student("tanaka", 10, "A");

 クラスについて詳しくはクラスページを参照してください。

JSON

 JavaScript では JSON と呼ばれるデータの受け渡しに利用するデータの記述方法があります。

 JavaScript では XML というテキストもデータの受け渡しに利用されます。どちらもそのテキストを JavaScript に渡すと素早く DOM として利用できるようしてくれます。

 JSON テキストのデータ構造は連想配列のリストと同じ key と value の組み合わせで編集します。

JSON
[
	{
		"name":"sam",
		"age":10,
		"class_name":"B"
	},
	{
		"name":"tanaka",
		"age":10,
		"class_name":"A"
	}
]

 JSON は連想配列と同じ構造になっているために連想配列が JSON データして解説されているケースがありますが同じではありません。

 JSON は Ajax といわれる XMLHttpRequest といった方法で外部からデータを取り込むときに利用されます。詳しくはDOM XMLHttpRequest インターフェイスを参照してください。

 JSON の方がデータとして扱い易く処理が速いと言われています。
 JSON は stringify() メソッドによって JSON データテキストとして出力することができます。XML は読み込むことができるのですが出力するにはその要領を作成する必要があります。

 JSON と XML、どちらを利用するかはその用途によると思います。