객체 - 객체

자바스크립트에는 8가지 자료형이 있는데 이 중에 7개는 원시타입 이라고 부르고 단 한가지의 데이터만(문자열, 숫자 등) 담을 수 있는 자료형이다.

나머지 하나는 객체형이고 객체형은 다양한 데이터를 담을 수 있다. 

객체는 중괄호{}를 이용해 만들 수 있고 중괄호 안에는 키(key):값(value) 쌍으로 구성된 프로퍼티 여러 개가 들어 있고,

키에는 문자형, 값에는 모든 자료형이 가능하다.

let user = {     // 객체
  name: "John",  // 키: "name",  값: "John"
  age: 30        // 키: "age", 값: 30
};

 

대괄호 표기법

여러 단어를 조합해 프로퍼티를 만들 경우에 띄어쓰기가 포함된 키는 따옴표를 붙여서 사용한다.

const 객체일지라도 객체의 내용을 변경할 수 있다. 변수 user는 객체 참조값을 저장하고 있고 이 값이 변경되는걸 막는 것이지, 객체의 내용(프로퍼티)을 변경하는건 막지 않는다.

 

const user = {
  name: "John"
};

// set
user["likes birds"] = true;

// get
alert(user["likes birds"]); // true

// delete
delete user["likes birds"];

alert(user['name']);
alert(user.name);

대괄호 안에는 문자열 형태가 와야 해서 user['name']이고, 점을 사용하면 user.name으로 쓸 수 있다.

 

 

for ... in 반복문

객체의 모든 키를 순회할 수 있다.

let menu = {
  width: 200,
  height: 300,
  title: "My Menu"
};

for(key in menu) {
  alert(menu[key]);
}

key in menu에서 key값은 문자열 타입이기 때문에 menu.key이 아니라 menu[key]로 불러와야 한다.

 

 

객체 정렬 방식

정수 프로퍼티는 크기 순으로 자동 정렬되고, 그 외의 프로퍼티는 추가된 순으로 정렬된다.

let codes = {
  "49": "독일",
  "41": "스위스",
  "44": "영국",
  // ..,
  "1": "미국"
};

for (let code in codes) {
  alert(code); // 1, 41, 44, 49
}

1, 41, 44, 49 순으로 자동 정렬되었다.

 

 

정수 프로퍼티를 크기 순이 아니라 추가된 순으로 정렬하고 싶을 때는 객체 프로퍼티를 정의할 때 숫자 앞에 +를 붙여서 for...in 문에서 일단 정수 취급 받지 않게 해서 추가된 순으로 정렬되게 하고 그 값을 사용해야 할 때 +를 붙여서 정수로 바꿔주면 된다.

let codes = {
  "+49": "독일",
  "+41": "스위스",
  "+44": "영국",
  // ..,
  "+1": "미국"
};

for (let code in codes) {
  alert( +code ); // 49, 41, 44, 1
}