반응형
1. 객체란?
주소록과 같이 한 대상의 다양한 정보들을 한 눈에 보기 좋게 정리할 때 필요한 자료 구조
객체는 키와 값 쌍(key-value pair)으로 이루어져 있다.
또한 객체는 중괄호(curly bracket) 내부에 키와 값이 존재한다.
let user = {
firstName: 'Adam',
lastName: 'Kim',
email: 'bobokook@gmail.com',
city: 'Busan'
};
// firstName, lastName 등을 키(key)
// 'Adam', 'Kim' 등을 값(value)
2. 객체의 값을 사용하는 방법 2가지
- 방법1: Dot notation
user.firstName; // 'Adam'
user.city; // 'Busan'
- 방법2: Bracket notation
user['firstName']; // 'Adam'
user['city']; // 'Busan'
* 주의사항: Bracket notation 사용 시 키(key)에 무조건 따옴표 붙이기!
3. 객체에 값 변경 & 추가 & 삭제 방법
user.lastName = 'Lee';
user['city'] = 'Seoul';
// 변경하는 방법
console.log(user)
// {firstName: 'Adam',
// lastName: 'Lee',
// email: 'bobokook@gmail.com',
// city: 'seoul'
// }
user.phoneNum = '010-1234-5678'
// 추가하는 방법
console.log(user)
// {firstName: 'Adam',
// lastName: 'Lee',
// email: 'bobokook@gmail.com',
// city: 'seoul',
// phoneNum: '010-1234-5678'
// }
delete user['email']
// 삭제하는 방법
console.log(user)
// {firstName: 'Adam',
// lastName: 'Lee',
// city: 'seoul',
// phoneNum: '010-1234-5678'
// }
반응형
'💻 개발자 > 🔨 HTML, CSS, JS' 카테고리의 다른 글
[JS] 내장 고차함수 이해하기 (Feat. map, filter, reduce) (0) | 2021.05.07 |
---|---|
[JS] 고차함수(higher order function)이란? (0) | 2021.05.07 |
[JS] 배열(Array) 기초 (0) | 2021.04.22 |
[JS] let, var, const 키워드 비교 (0) | 2021.04.22 |
[JS] 반복문 기초 (for문과 while문) (0) | 2021.04.15 |