1. 객체(Object)
자바스크립트 데이터 타입 중 하나로,
키(key)와 값(value)으로 구성된 프로퍼티(property)의 정렬되지 않은 집합
- 자바스크립트를 구성하는 거의 '모든 것'이 객체.
- 배열(Array)과 마찬가지로, 여러 종류의 데이터를 묶음으로 관리하는 데이터 타입
2. 객체의 구성
const person = {
name : '김보윤',
location : {
country:'대한민국',
city:'서울'
},
mbti : 'ENFP',
color : ['보라', '파랑']
}
console.log(person)
- 객체는 0개 이상의 property로 구성된 집합
- property는 키(key)와 값(value)으로 구성됨
- 자바스크립트에서 사용할 수 있는 모든 값은 프로퍼티 값이 될 수 있음
- 객체를 생성할 때는 {} 안에 키(key)와 값(value)을 쌍으로 묶어서 만듦
이때, key 값이 여러개일 경우엔 쉼표(,)로 구분
** 배열(Array)와 다른 점은, 순서가 중요하지 않다는 것!
- 배열(Array): 순서를 가진다.
- 객체(Object): 의미를 가진다. 호출할 시 순서가 뒤죽박죽 나오게 됨
따라서, 객체에 저장된 데이터에 접근하기 위한 2가지 방법이 존재함
3. 객체에 접근하는 방법
3-1. Dot Notation
console.log(person.location)
console.log(person.color)
- 이름 그대로, 점을 이용해서 접근하는 방법
- 객체 이름에 점을 찍고 접근하고자 하는 key를 입력하여 value를 얻음
- 프로퍼티 식별자는 오직 알파벳만 가능(_ & $ 포함)
- 숫자로 시작할 수 없음
- ex) person.location$
- * 변수를 포함할 수 없음 *
3-2. Bracket Notation
console.log(person['location'])
console.log(person['color'])
- 괄호를 이용해서 접근을 하는 방법
- 대괄호 열어서 접근하고자 하는 key를 ''를 안에 입력하여 value를 얻음
- 프로퍼티 식별자는 문자열 혹은 문자열을 참조하는 변수
- 숫자로 시작할 수 있음
- 공백 사용 가능
ex) person['1location'], person['location 1']
- * 변수를 포함할 수 있음 *
4. 객체 수정 / 추가, 삭제
4-1. 수정 / 추가
[수정]
- Dot Notation
person.name = "보윤김"
- Bracket Notation
person['name'] = "Boyoon Kim"
[추가]
- Dot Notation
person.blood = "A"
- Bracket Notation
person['height'] = "168"
4-2. 삭제
- Dot Notation
delete person.blood
- Bracket Notation
delete person['height']