Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
Tags
- 알고리즘문제풀이
- HTML
- JavaScript
- Next
- leetcode문제풀이
- 자바스크립트 연결리스트
- 자바스크립트 알고리즘 문제
- 타입스크립트
- NPM
- 자바스크립트
- next13
- 프론트엔드
- Baekjoon
- 자바스크립트코딩테스트
- 리액트
- til
- JS
- 프로그래머스
- 제로베이스
- stack문제
- 리액트쿼리
- leetcode
- 자바스크립트 알고리즘
- 자바스크립트 문제풀이
- react
- 자바스크립트 문제 풀이
- lodash
- CSS
- 자바스크립트 문제
- Next.js13
Archives
- Today
- Total
코드노트
js 데이터 알아보기 / 구조 분해 할당 본문
구조 분해 할당 Destructuring assignment
const user = {
// key: value
name: 'codenote',
age: 20,
email: 'kjun_all@naver.com',
address: 'USA'
};
const {name, age, email, address = 'Korea'} = user;
// 필요한 것들을 정리해서 꺼내서 사용할수 있다.
// 기본값을 지정할 수 있다.
// 데이터가 있으면 기본값은 무시된다.
// 변수이름을 따로 지정할 수도 있다. ex/ name: codenote
console.log(`사용자의 이름은 ${name} 입니다.`); // 사용자의 이름은 codenote 입니다.
console.log(`${name}의 나이는 ${age}세 입니다.`); // codenote의 나이는 20세 입니다.
console.log(`${name} 이메일 주소는 ${email} 입니다.`); // codenote 이메일 주소는 kjun_all@naver.com 입니다.
console.log(address); // USA
- 필요한 데이터들을 정리해서 꺼내서 사용할 수 있다.
- 데이터가 없다면 기본값 을 따로 지정할 수 있다.
- 데이터가 있으면 기본값은 무시되고 데이터로 출력된다.
- 변수이름을 따로 지정할 수 있다. ex) name: codenote
const fruits = ['Apple', 'Banana', 'Cherry'];
const [a, b, c, d] = fruits;
console.log(a, b, c, d); // Apple Banana Cherry undefined
const fruits = ['Apple', 'Banana', 'Cherry'];
const [ , , c] = fruits;
console.log(c); // cherry
- 배열데이터도 구조 분해 할당이 가능하다.
- 세번째 데이터만 호출하고 싶다면, [, , c] 이렇게 쉼표를 사용해서 빈 공간을 만들어서 호출한다.
'Code note > 자바스크립트' 카테고리의 다른 글
js 데이터 알아보기 / 얕은복사(Sallow copy), 깊은복사(Deep copy) (0) | 2022.06.06 |
---|---|
js 데이터 알아보기 / 전개 연산자 (0) | 2022.06.01 |
js 데이터 알아보기 / array 배열 메서드 / length, concat, forEach, map, filter, find, findInd (0) | 2022.05.30 |
js 데이터 알아보기 / number 수학 객체 / parseInt, parseFloat (0) | 2022.05.29 |
js 데이터 알아보기 / String 문자열 생성자 indexOF, length, slice, replace, match, trim (0) | 2022.05.29 |