- 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']) // 암시적으로 변환된다.
- 값 갱신
- Property 동적 생성
- 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)
}
}