[JavaScript] 객체

• 객체는 키로 구분된 데이터 집합이나 복잡한 개체를 저장할 수 있다.
• 객체는 {…} 중괄호를 이용해 만들 수 있다.
• 중괄호 안에 들어가는 구성
  • 프로퍼티(property): ’키(key) : 값(value)’
  • key : 문자형, value : 모든 자료형 작성 가능.

빈 객체 (빈 서랍장) 만드는 방법

let user = new Object(); // '객체 생성자' 문법
let user = {};  // '객체 리터럴' 문법

리터럴과 프로퍼티

중괄호 {...}를 이용해 객체를 선언하는 것을 객체 리터럴(object literal) 이라고 부름

중괄호 {...}  안에는 ‘키: 값’ 쌍으로 구성된 프로퍼티가 들어간다.

고로 아래 코드는 user라는 객체 안에 두개의 프로퍼티가 담겨 있는 것.

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

// 프로퍼티 값 얻기
alert( user.name ); // John
alert( user.age ); // 30

delete 연산자를 사용하여 프로퍼티 삭제도 가능

delete user.age;

상수 객체는 수정될 수 있음

(*)로 표시한 줄에서 오류를 일으키는 것처럼 보일 수 있지만 그렇지 음. const는 user의 값을 고정하지만, 그 내용은 고정하지 않는다.

const는 user=...를 전체적으로 설정하려고 할 때만 오류가 발생합니다.

const user = {
  name: "John"
};

user.name = "Pete"; // (*)

alert(user.name); // Pete

대괄호 표기법

여러 단어를 조합해 프로퍼티 키를 만드는 방법

let user = {};

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

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

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

대괄호 표기법 안에서 문자열을 사용할 땐 문자열을 따옴표로 묶어줘야 함

let key = "likes birds";

// user["likes birds"] = true; 와 같습니다.
user[key] = true;

변수 key 는 런타임에 평가되기 때문에 사용자 입력값 변경 등에 따라 값이 변경될 수 있다. 어떤 경우든, 평가가 끝난 이후의 결과가 프로퍼티 키로 사용됨

let user = {
  name: "John",
  age: 30
};

let key = prompt("사용자의 어떤 정보를 얻고 싶으신가요?", "name");

// 변수로 접근
alert( user[key] ); // John (프롬프트 창에 "name"을 입력한 경우)

단축 프로퍼티

function makeUser(name, age) {
  return {
    name, // name: name 과 같음
    age,  // age: age 와 같음
    // ...
  };
}

‘in’ 연산자로 프로퍼티 존재 여부 확인하기

자바스크립트 객체의 중요한 특징 중 하나는 다른 언어와는 달리, 존재하지 않는 프로퍼티에 접근하려 해도 에러가 발생하지 않고 undefined를 반환함.

그럼 어떻게 프로퍼티 존재 여부를 확인할 수 있을까?

in 연산자 사용

"key" in object

let user = { name: "John", age: 30 };

alert( "age" in user ); // user.age가 존재하므로 true가 출력됩니다.
alert( "blabla" in user ); // user.blabla는 존재하지 않기 때문에 false가 출력됩니다.

‘for…in’ 반복문

for..in 반복문을 사용하면 객체의 모든 키를 순회할 수 있다.

for (let code in codes) {

}

let user = {
  name: "John",
  age: 30,
  isAdmin: true
};

for (let key in user) {
  // 키
  alert( key );  // name, age, isAdmin
  // 키에 해당하는 값
  alert( user[key] ); // John, 30, true
}