[ 05.31 ] Spread / Rest , 구조분해 문법
[Achievement Goal]
Spread 연산자와 Rest 문법의 사용법을 이해한다.
구조분해에 대해 이해한다.
1. Spread
spread 연산자란 ?
이미 배열인 어떠한 상태를 풀어서 인자로 전달하거나,
다른 배열과 합치는 기능을 한다.
기존 배열을 변경하지 않는 immutable 성질을 띄고 있기 때문에 배열을 복사할 때도 유용하다.
let sickBody = ['승모근','허리','손목']
let careBody = ['거북목','무릎','골반',...sickBody]
console.log(careBody)
// (6) ["거북목", "무릎", "골반", "승모근", "허리", "손목"]
객체에서도 사용이 가능하다.
let person = { name : 'sook',age : '30s' }
let personDetail = { city : 'seoul',job : 'front-end developer'}
let info1 = {...person}
let info2 = {...person,...personDetail};
console.log(info1)
// {name: "sook", age: "30s"}
console.log(info2)
// {name: "sook", age: "30s", city: "seoul", job: "front-end developer"}
2. Rest 연산자
rest 연산자란 ?
함수의 파라미터를 배열의 형태(스프레드 연산자)로 받아서 사용할 수 있다.
(파라미터 개수가 가변적일때 유용함.)
function myFunc(a,b,...nums){
console.log('a',a);
console.log('b',b);
console.log('nums',nums);
}
myFunc('one','two','three','four','five')
myFunc 에 있는 문자열 중, a,b 에 해당하는 one 과 two 를 제외한 나머지는 nums 라는 문자열에 배열처리가 되어있다.
rest 파라미터는 이렇게 배열로 해체가 될 수 있다.
3. 구조분해
구조분해로 할당한다는 뜻은
spread 문법을 이용하여 값을 해체한 후 개별 값을 변수에 새로 할당하는 과정을 말한다.
function whois( {displayNm : displayNm, fullNm : {firstNm : name}} ){
console.log(displayNm + ' is ' + name);
}
let user = {
id : 100,
displayNm : 'sook',
fullNm : {
firstNm : 'sookyoung',
lastNm : 'lee'
}
};
whois(user)
// sook is sookyoung
아.. 어렵다 ,, 구조분해는 아무래도 다시 공부해야 할 것 같다.. ㅠ0ㅠ
Author And Source
이 문제에 관하여([ 05.31 ] Spread / Rest , 구조분해 문법), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@22soook00/05.31-Spread-Rest-구조분해-문법저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)