객체 비구조화 할당

TASON·2021년 6월 23일
1

자바스크립트

목록 보기
7/11

보통 객체 내부의 값을 조회할 때마다 객체.을 입력한다.
이 방법보다 코드를 더욱 짧고 보기 좋게 작성하는 방법이 하나 있다.
바로 객체 비구조화 할당이다.
다른 말로 객체 구조 분해라고도 한다.


예시

const tason = {
  name: '김태현',
  job: '학생',
  sex: '남자',
};

const erik = {
  name: '이민교',
  job: '교수',
  sex: '남자'
};

function print(person) {
  const { 'name', 'job', 'sex' } = person;
  console.log(`${name} ${job}의 성별은 ${sex}입니다.`);
}

print(tason); // 김태현 학생의 성별은 남자입니다. 출력됨
print(erik); // 이민교 교수의 성별은 남자입니다. 출력됨

const { 'name', 'job', 'sex' } = person;
이 코드가 객체에서 값들을 추출해서 새로운 상수로 선언해 주는 것이다.
더 나아가, 매개 변수에 직접 객체 비구조화 할당을 할 수도 있다.

const tason = {
  name: '김태현',
  job: '학생',
  sex: '남자',
};

const erik = {
  name: '이민교',
  job: '교수',
  sex: '남자'
};

function print({ name, job, sex }) {
  console.log(`${name} ${job}의 성별은 ${sex}입니다.`);
}

print(tason); // 김태현 학생의 성별은 남자입니다. 출력됨
print(erik); // 이민교 교수의 성별은 남자입니다. 출력됨

객체 비구조화 할당 시 모든 객체 속성이 들어갈 필요가 없다.
또한 속성의 순서가 바뀌어도 상관 없다.

profile
프론트엔드 개발자 / iOS 개발 스터디 중

0개의 댓글