반응형
Object literal
- Javascript에서는 객체를 만드는 여러 가지 방법이 존재한다.
- const obj = {};와 같은 객체를 ES6에서 Object literal라 칭한다.
ES6에서 추가된 Object literal 기능
▶ 속성(property) 축약 표현
- 속성값으로 변수를 사용하는 경우 변수이름과 속성이름이 같다면 키를 생략.
- key와 value의 이름이 같고 value가 변수로 선언되는 특수한 경우에 사용한다.
<body>
<script>
const a = 50
const ob = {
a //key와 value의 이름이 같고 value가 변수로 선언되어야한다.
}
console.log(ob.a)
//50
</script>
</body>
▶ 메서드 축약 표현
- 메서드의 이름과 키를 동일한 이름으로 사용할 경우 메서드를 축약하여 표현
<body>
<script>
const a = 50
const ob = {
a,
getA(){
return this.a
}
}
console.log(ob.getA())
//50
</script>
</body>
▶ 계산된 속성 이름(Computed propety name)
- 표현식을 사용해 Key를 동적으로 생성.
- ES5에서는 Object literal 외부에서 구현.
- ES6에서는 Object literal 내부에서도 구현 가능.
Object의 순회
- Object의 속성의 순서는 무순서.
- 배열처럼 순차적인 인덱스가 없음.
- 순회하기 위해서 for~in 문을 사용
예시
<body>
<script>
const obj = {
a : 1,
b : 2,
c : 3
}
for (const i in obj) //obj의 key가이 i로 넘어가는 구조.
{
console.log(i)
}
//a
//b
//b
</script>
</body>
- Object안의 모든 elemet를 출력하는 법
<body>
<script>
const obj = {
a : 1,
b : 2,
c : 3
}
for (const i in obj) //obj의 key가이 i(key)로 넘어가는 구조.
{
console.log(obj[i]) //(obj[key])
}
//1
//2
//3
</script>
</body>반응형
'JavaScript' 카테고리의 다른 글
| [JavaScript] 문자열에서 특정한 문자 찾고 문자 추출하기. (0) | 2022.04.14 |
|---|---|
| [JavaScript] Primitive type을 Object literal(Object type)으로 변환 (0) | 2022.04.14 |
| [JavaScript] object type(객체형) +예제 (0) | 2022.04.12 |
| [JavaScript] 함수 호출시 주의사항(선언함수 vs 익명함수), Hoisting (0) | 2022.04.12 |
| [JavaScript] IIFE(즉시 실행 함수 표현식), strict mode(엄격 모드) (0) | 2022.04.12 |