LoginSignup
1
3

More than 5 years have passed since last update.

プログラミング初心者のJavaScript備忘録-オブジェクト編

Last updated at Posted at 2016-01-23

オブジェクトの作り方。

var obj = {};

中身はプロパティと値

var obj = {
    key : value
};

複数プロパティを設定したいときはカンマでつなぐ。最後のプロパティにはいらない。

var obj = {
    key1 : value1,
    key2 : value2,
    key3 : value3
};

ドット演算子を使ってアクセスできる。

var obj = {
    key : value
};
window.alert(obj.key); //valueが表示

あとからプロパティの変更•追加などの操作ができる。

var obj = {
    x : 1,
    y : 2
};
obj.x = 2; //変更してる
obj.z = 3; //追加してる

プロパティには関数もいれれる。このオブジェクトのプロパティに入った関数のことをメソッドと呼ぶ。

var obj = {
    key : function(){...}
};

補足

プロパティの役割は『変数』と一緒で、オブジェクトの中に入っている変数というイメージ。プロパティの値にはどんなものでも入るので『値』である関数も入る。→変数に入れて取り出したり、受け渡せる。↓のようにメソッドはそれを持つオブジェクトに参照されているだけ。

メソッドはそれを持つオブジェクトに参照されているだけ

//func には関数のアドレス情報
var func = function(){...};
func();

//func にはメソッドのアドレス情報
var obj = {
    func : function(){...}
};
obj.func();

this

javaScriptにおいてオブジェクトのプロパティにメソッドを定められ、そのメソッド内で「this」が使われている場合は、その関数が代入されたプロパティの持ち主オブジェクトのことを「this」として処理がおこなわれる。

var x = 1;
var obj = {
    x : 2,
    func : function(){
        alert(this.x);
    }
};
obj.func();//2が表示

オブジェクトの生成

newとコンストラクタを使って生成

同じ機能や属性(性質)を持ったオブジェクトを量産する。

new

オブジェクトの生成•継承•初期化を指示する演算子。

コンストラクタ

newを使って生成されるオブジェクトの初期化に使われる関数のことをコンストラクタと呼ぶ。

//コンストラクタの定義
function Product(){}

//newを使ったオブジェクトの生成
var obj = new Product(); 

補足

コンストラクタは頭を大文字にする習慣がある。小文字でもエラーになる訳ではないが大文字にする。

引数あり

引数もいれられる。

function Point(x, y) {
    this.x = x;
    this.y = y;
}
var myPoint = new Point(1, 10);//プロパティxの値が1、プロパティyの値が10のオブジェクトが生成される
1
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
3