第10章対象転

オブジェクトバー
オブジェクトは0つ以上のPropertyで構成され、Propertyはキーと値で構成されます.

var person = {
  name: 'Lee',
  age: 20
};

この場合、property値が関数であれば、메서드(method)と呼ばれ、一般関数を区別するために用いられる.

var counter = {
  // 프로퍼티
  num: 0, 
  // 메서드
  increase: function() {
    this.num++;
  }
};

関数は値として処理できるのでproperty値として使用できます.
属性:オブジェクトの状態を表す値(データ)
メソッド:Property(ステータスデータ)の参照と操作の動作
オブジェクトはオブジェクトの状態を表す値と参照と操作が可能な動作を同時に含むことができるため、状態と動作を1つのユニットに構造化することが非常に有用である.
Property動的作成
存在しないプロジェクトに値を割り当てると、プロジェクト値が動的に作成、追加、割り当てられます.

var person = {
  name: 'Lee'
};

person.age = 20; // age 프로퍼티가 동적으로 생성되고 값이 할당

console.log(person); // {name: "Lee", age: 20}

プロパティの削除delete演算子は、オブジェクトのpropertyを削除します.delete演算子の被演算子は、property値に近い式でなければならない.存在しないプログラムを削除すると、間違いなく無視されます.

var person = {
  name: 'Lee'
};

person.age = 20;

delete person.age; // 삭제

delete person.address; // 삭제 불가능. 하지만 에러는 발생하지 않는다.

console.log(person); // {name: 'Lee'}

ES 6に追加されたオブジェクト文字の拡張ES6は、より単純で表現力のあるオブジェクト文字拡張機能を提供します.
📙 Propertyサムネイル表示
ES 6では、変数をproperty値として使用する場合、変数名がpropertyキーと同じ名前である場合、propertyキーを省略することができる.この場合、propertyキーは自動的に変数名として生成されます.

let x = 1, y = 2;

// ES5
var obj = { 
  x: x,
  y: y
};

console.log(obj); // {x: 1, y: 2}


// ES6
const obj = { x, y }; // 프로퍼티 축약 표현

console.log(obj); // {x: 1, y: 2}

📙 計算された構成名
文字列または文字列タイプに変換可能な式を使用して、동적でpropertyキーを生成できます.
ただし、propertyキーとして使用する式のカッコ([...])ロープで縛らなければならない.これを계산된 프로퍼티 이름(computed property name)といいます.

// ES5
var prefix = 'prop';
var i = 0;

var obj = {};

// 객체 리터럴 외부에서 대괄호를 사용해야 함
obj[prefix + '-' + ++i] = i;

console.log(obj); // {prop-1: 1, prop-2: 2, prop-3: 3}


// ES6
const prefix = 'prop';
let i = 0;

// 객체 리터럴 내부에서도 동적 생성 가능
const obj = {
  [`${prefix}-${++i}`]: i,
  [`${prefix}-${++i}`]: i,
  [`${prefix}-${++i}`]: i,
};

console.log(obj); // {prop-1: 1, prop-2: 2, prop-3: 3}

📙 メソッド簡略表示
ES 5でメソッドを定義するには、関数をProperty値として指定しますが、ES 6ではメソッドの定義時に関数キーワードを省略したサムネイル表示を使用できます.

// ES5
var obj = {
  name: 'Lee',
  // 프로퍼티 값으로 함수를 할당
  sayHi: function() {
    console.log('Hi ' + this.name);
  }
};

obj.sayHi(); // Hi! Lee


// ES6
const obj = {
  name: 'Lee',
  // 메서드 축약 표현
  sayHi() {
    console.log('Hi ' + this.name);
  }
};

obj.sayHi(); // Hi! Lee

ES 6で定義された方法の簡略表現は、Propertyに割り当てられた関数とは異なる.これを第26章で確認!