본문 바로가기
JavaScript

객체

by 해-온 2023. 2. 21.

☀️ 객체

객체는 0개 이상의 프로퍼티로 구성된 집합이며, 프로퍼티는 키와 값으로 구성된다.

객체는 다양한 방법으로 생성할 수 있는데 가장 일반적인 방식은 객체 리터럴을 사용하는 것이다.

 

const fruit = {
  name: 'apple',
  color: 'red',
};

 

객체는 { key : value } 형태를 기본으로 가지고 있다.

key에는 문자, 숫자, 문자열 등이 사용가능하고

value에는 원시값, 객체 등이 사용가능하다.

 

☀️ 프로퍼티 접근

프로퍼티에 접근하기 위해서는 두 가지 방법이 있다.

먼저, 마침표 표기법이다.

 

const fruit = {
  name: 'apple',
  color: 'red',
};

console.log(fruit.name);

 

두번째는 대괄호 표기법이다.

다만, 첫 번째 표기법과 다른 점은 대괄호 안에 key는 꼭 따옴표로 감싸야 한다는 것이다.

 

const fruit = {
  name: 'apple',
  color: 'red',
};

console.log(fruit['name']);

 

☀️ 프로퍼티 변경

프로퍼티 값 갱신

이미 존재하는 프로퍼티의 값을 할당하면 갱신된다.

 

const fruit = {
  name: 'apple',
  color: 'red',
};

fruit.name = 'orange'

console.log(fruit['name']); //orange

 

프로퍼티 동적 생성

존재하지 않은 프로퍼티에 값을 할당하면 동적으로 생성되고 값이 할당된다.

 

const fruit = {
  name: 'apple',
  color: 'red',
};

fruit.display = '🍎'

console.log(fruit.display); //🍎

 

프로퍼티 삭제

delete 연산자를 사용하면 프로퍼티를 삭제한다.

 

const fruit = {
  name: 'apple',
  color: 'red',
};

delete fruit.name

console.log(fruit.name); //undefined

 

☀️ 프로퍼티 축약

프로퍼티 값으로 변수를 사용하는 경우, 변수 이름과 프로퍼티 키가 같은 이름이라면 생략이 가능하다.

 

const x = 0;
const y = 0;
const coordinate = { x, y }; 
// const coordinate = { x: x, y: y };

console.log(coordinate);

 

 

'JavaScript' 카테고리의 다른 글

배열  (0) 2023.02.26
클래스  (0) 2023.02.24
함수  (0) 2023.02.19
제어문  (0) 2023.02.19
연산자  (0) 2023.02.19

댓글