• literal이란 사람이 이해할 수 있는 문자 또는 약속된 기호를 사용하여 값을 생성하는 표기법이다.
  • {}로 0개 이상의 property를 선어하면 변수 할당 시점에 객체리터럴을 해석해 객체를 할당한다.
  • 객체 리터럴은 expression이므로 <;>가 필요하다. block과는 다르다.
var person = {
    name: 'LEE',
    age: 20
}
  • <name: ‘LEE’>, <age: 20>를 프로퍼티라 부른다.
  • name은 property의 키, ‘LEE’는 프로퍼티의 값이다.

Property

  • key에 문자열이나 심벌이외의 값 => 문자열로 변환
  • Access
    • dot notation
    • bracket notation
  • 키가 숫자로 이루어진 문자열의 경우 따옴표를 생략해도 암시적으로 변환된다.
varl person = {
    name: 'lee'
    1: 2
};

console.log(person.name); // dot 표기법
console.log(person['name']); // bracket 표기법

console.log(person[1]) => console.log(person['1']) // 암시적으로 변환된다.
  • 값 갱신
    • person.name = ‘lee’
  • Property 동적 생성
    • persons.name2 = ‘lee’
  • Property 삭제
    • delete person.name2
    • property의 key가 존재하지 않더라도 Error가 발생하지 않는다.

ES6에 추가된 객체 리터럴 확장기능

프로퍼티 축약표현

  • 변수 이름과 프로퍼티 키가 동일한 이름일 때 프로퍼티 키를 생략할 수 있다.
    var x = 1, y = 2
    var obj  = {
        x: x,
        y: y
    }
    
    // {x:1, y:2}
    var obj = {x, y}; // 위와 같이 선언해도 동일하다.
    

계산된 프로퍼티 이름

var i = 0;
var prefix = "prefix"
var obj = {};

obj[prefix + '-' + ++i ] = i;
obj[prefix + '-' + ++i ] = i;
obj[prefix + '-' + ++i ] = i;
obj[prefix + '-' + ++i ] = i;


//
const obj = {
    [`${prefix}-${++i}`] : i,
    [`${prefix}-${++i}`] : i,
    [`${prefix}-${++i}`] : i,
}

메서드 축약 표현

// ES5
var obj = {
    name: 'Lee',
    sayHi: function() {
  console.log("HI" + this.name)
    }
}
// ES6
var obj = {
    name: 'Lee',
    // method 축표현
    sayHi(){
  console.log("HI" + this.name)
    }
}