Old Branch

[React-Native] React-Native 입문기 - ES6(2) 객체비구조화

woolbro 2019. 10. 21. 01:16
반응형

안녕하세요, 이번 포스팅 또한 React-Native 작성을 위한 ES6 문법을 익혀보도록 하겠습니다.

 

아래의 링크는 최신 javascript 문법을 지원하는 웹콘솔입니다.

 

https://es6console.com

 

ES6 Console - try JavaScript compilers

 

es6console.com


 

객체 비구조화

사용할 객체를 우선 작성 해 보도록 하겠습니다.

const address = {
  country: '한국',
  city: '성남',
  street: '분당구',
  str_num: 193,
  postcode: '16053',
};

위의 객체를 출력 해 보도록 하겠습니다!

const { country, city } = address;
console.log(`${country}, ${city}`); //한국 ,성남

위의 코드를 실행하면  한국, 성남이 출력되게 됩니다.

 

위의 객체를 사용 해서 객체 비구조화를 보도록 하겠습니다.

// 객체 비구조화, Object Destructuring.
const country = 'America';			//a
const city = 'New York';			//b

const { country: nextCountry, city: nextCity } = address;
console.log(`${country}, ${city}`);

a와 b 는 위의 객체에 존재하는 이름인 country, city로 변수가 정해졌습니다.

이름을 바꾸어 출력 해도 되지만 위의 방법으로 작성하면 새로 저장한 country, city가 출력되게 됩니다.