객체 (Object)

키(key) : 값(value) 쌍으로 이루어진 property(프로퍼티)를 여러 개 저장할 수 있는 자료형.

객체 생성법

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

객체 선언은 주로 객체 리터럴(object literal) 방법을 사용.

객체 생성자 함수를 사용한 객체의 생성은 기본문법(7)-객체(4)에서 서술.

객체 프로퍼티 조작

객체 생성

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

Property 추가

(object).(key) = (value) 또는 (object name)[(key)] = (value) 로 프로퍼티 추가.

key값을 대괄호로 감싸는 문법은 아래에서 서술.

let user = {};
user.name = "John";
console.log(user.name);

// output : John

Property 삭제

delete (key) 로 객체 키값과 함께 프로퍼티 삭제.

let user = {
  name: "John",
  age: 30
};
delete user.name;
console.log(user);

// output : { age: 30 }

단축 property

property의 value를 변수에서 받아와 사용할 때, key값과 변수의 이름이 동일하다면 축약하여 사용 가능.

let key = "name";
let age = 30;

let user = {
    key,   // key : key 와 동일
    age,   // age : age 와 동일
};

console.log(user);
// output : { key: 'name', age: 30 }

대괄호 표기법(Square brackets)

key값이 '유효한 변수 식별자' (Ex. 띄어쓰기를 포함한 문자열, 숫자로 시작하는 key, $나 _가 아닌 특수문자를 포함) 가 아니거나, 변수를 key값으로 이용하고 싶을 때 대괄호 표기법을 사용.

Property 추가, 삭제, value 접근

let user = {};

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

// get
console.log(user["likes birds"]); // output : true

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

변수로 property에 접근

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

let key = "name";
console.log(user[key]); // key값에 변수를 넣어 접근.
console.log(user.key);	// user.key로는 접근 불가.
// output : 
// John
// undefined

key = "age";
delete user[key]; // key값이 age인 property 삭제.
console.log(user);
// output : { name: 'John' }

계산된 property

Object(객체)를 생성할 때, key 또는 value를 변수를 이용해 생성 가능.

let key1 = "name";
let value2 = 30;

let user = {
    [key1]: "John",			// key값에 변수를 이용할 때는 [ ]를 이용.
    age: value2,			// value에 변수를 이용할 때는 변수만 입력.
    ["last" + key1]: "HI"	// [ ]내에 복잡한 표현식이 들어가도 무방.
};

console.log(user);
// output : { name: 'John', age: 30, lastname: 'HI' }

'in' 연산자로 property 존재 여부 확인

(key) in (object) 로 해당 key값을 가진 property의 존재 여부를 확인할 수 있음.

let user = {};

console.log(user.name === undefined);	// output : true
console.log("name" in user);			// output : false

'for...in' 반복문

for ( "key" in (object) ) 로 object의 모든 프로퍼티를 순회 가능.

"key" 에 각 property의 key값이 담기며 순회. Python의 for...in과 유사함.

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

for (key in user) {
    console.log(user[key]);
}

// output : 
// John
// 30
// true

reference

https://javascript.info/

[JavaScript] JavaScript 기본 문법 (4) - 객체 (1) - 기본 개념