[자바스크립트] 객체 란?

자바스크립트 객체의 기초 개념

객체는 다음과 같은 구조를 갖습니다.

var 객체명 = {
    key1 : value1,
    key2 : value2,
    key3 : value3,
    .
    .
}; 

배열이 index 와 value 의 쌍이라고 한다면 객체는 key 와 value 의 쌍이라고 할 수 있습니다. 다만 객체는 value 에 함수가 올 수 있습니다.

다음과 같은 배열이 있다고 합시다.

var arr = ['Kim', 'student', 18];

위 배열은 0번째 요소가 'Kim', 1번째 요소가 'student', 2번째 요소가 18 입니다. 각 요소의 인덱스가 key인 것입니다. 따라서 arr[0], arr[1], arr[2] 이렇게 접근합니다.

위 배열과 비슷한 객체를 생성해 보겠습니다.

var userinfo = {
    name : 'Kim',
    job : 'student',
    age : 18
};

객체는 속성(요소)의 순서가 없습니다. 따라서 userinfo[name], userinfo[job], userinfo[age] 이렇게 접근합니다. 

일반적으로 대괄호 [] 보다는 점 .을  많이 사용해서 userinfo.name, userinfo.job, userinfo.age 이렇게 접근합니다.

반복문을 통해 모든 요소를 출력하는 예제입니다.

//배열의 모든 요소 출력
for(var i in arr) {
    alert(i + ' : ' + arr[i]);
}
 
//객체의 모든 속성 출력
for(var key in userinfo) {
    alert(key + ' : ' + userinfo[key]);
}

객체 속성의 추가 / 제거

객체의 속성은 동적으로 추가와 제거가 가능합니다.

userinfo.sex = 'male'; // userinfo 객체에 sex 속성 추가
delete (userinfo.age); // userinfo 객체의 age 속성 제거