본문 바로가기

Front-End/JavaScript

[JavaScript] 객체 (Object)

객체 (Object)

: JavaScript의 데이터 유형 중 하나로 여러 속성을 하나의 변수에 저장할 수 있도록 해주는 데이터 타입이다.

: Key - Value로 구성된 집합이다.

 

1) 객체 생성

  1-1) Object() 생성자를 통한 생성

  : Object() 생성자는 주어진 값을 객체 래퍼로 만들어준다.

  : 만약 값이 null 또는 undefined라면 빈 객체를 생성해 반환한다.

const obj = new Object(); //{ ... } 빈 객체 생성
const obj2 = new Object({foo: 42}); //{foo: 42}

 

  1-2) 객체 초기자 / 리터럴 구문을 통한 생성

  : 객체 초기자는 중괄호({})로 묶인 0개 이상의 객체의 프로퍼티명과 관련 값의 쌍을 콤마로 구분한 목록이다.

  : 각각의 프로퍼티는 이름과 값을 콜론(:)으로 연결하고, 콜론(,)으로 다른 프로퍼티와 구분한다.

const obj1 = {
    a: 'foo',
    b: 42
};

 

 

2) 객체 프로퍼티 참조

문법
: 객체이름.프로퍼티명
: 객체이름["프로퍼티명"]
const obj1 = {
    name: '홍길동',
    age: 26
};
const name = obj1.name; //홍길동

 

3) 객체에 Key / Value 추가

문법
: 객체이름.프로퍼티명 = 값
: 객체이름["프로퍼티명"] = 값
const obj1 = {
    name: '홍길동',
    age: 26
};
obj1.tel = '010-1234-5678';
obj1["address"] = 'Seoul';

console.log(obj1); 
/* {
  address: "Seoul",
  age: 26,
  name: "홍길동",
  tel: "010-1234-5678"
} */

 

4) 객체 Key / Value 수정

문법
: 객체이름.프로퍼티명 = 수정할 값
: 객체이름["프로퍼티명"] = 수정할 값
const obj1 = {
    name: '홍길동',
    age: 26
};
obj1.age = 25

console.log(obj1); 
/* {
  age: 25,
  name: "홍길동"
} */

 

5) 객체 Key / Value 삭제

문법
: delete 객체이름.프로퍼티명
const obj1 = {
    name: '홍길동',
    age: 26
};
delete obj1.age;

console.log(obj1); 
/* {
  name: "홍길동"
} */

 

 

*참고 자료*

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Object

https://velog.io/@surim014/%EC%9B%B9%EC%9D%84-%EC%9B%80%EC%A7%81%EC%9D%B4%EB%8A%94-%EA%B7%BC%EC%9C%A1-JavaScript%EB%9E%80-%EB%AC%B4%EC%97%87%EC%9D%B8%EA%B0%80-part-7-Object-35k01xmdfp