it/JavaScript

Javascript es6 destructuring assignment

하얀나다 2020. 12. 10. 00:00

비구조화 할당, 구조분해, destructuring assignment

 

객체를 만들어쓸때 아래와 같이 만드는게 기본이였는데

const dog = {
  name: "Gaja",
  age: 5
};

function print(what) {
  const text = `우리집 강아지이름은 ${what.name}이고 나이는 ${what.age}살 입니다!`;
  console.log(text);
}

print(dog);

 

es6 에서는 다음과 같이 사용가능

 

const dog = {
  name: "Gaja",
  age: 5
};
function print(what) {
  const { name, age } = what;
  const text = `우리집 강아지이름은 ${name}이고 나이는 ${age}살 입니다!`;
  console.log(text);
}
print(dog);

이거를 다시 아래 처럼 사용가능

const dog = {
  name: "Gaja",
  age: 5
};
function print({ name, age }) {
  const text = `우리집 강아지이름은 ${name}이고 나이는 ${age}살 입니다!`;
  console.log(text);
}
print(dog);