Language
자바스크립트 spread syntax(...)
궁금한게 많은 개발자
2022. 4. 3. 20:18
ES2015에서 새로 추가된 syntax : 병합, 구조 분배 할당(destructuring) 등에 다양하게 활용
각각의 멤버를 흩뿌려서 가진다라는 의미로 생각할 수 있음
override기능도 존재 -> 뒷쪽에 spread syntax를 써주면 앞쪽에 공통으로 겹치는 멤버를 override할 수 있음(앞쪽 불가)
주요 기능 : 여러 객체를 하나의 객체로 손쉽게 병합, 하나의 객체에서 원하는 멤버만 빼서 분배 가능, 배열 병합 가능
특정 변수 지정 및 남은 모든 원소들을 배열에서 받아오는 할당 기능이 존재
예시를 통해 확인
const array = [1,2,3,4,5]
const head = [head, ...rest] = array
/* head = 1, rest = 2,3,4,5 */
const personalData = {
email: 'abc@def.com'
password: '*****'
}
const publicData = {
nickname : 'foo'
}
const override = {
email : 'def@def.com'
}
const shouldOverride = false
const user = {
...personalData,
...publicData,
...(shouldOverride ? override : null), // email: 'def@def.com'
} // shouldOverride에 따라 overriding정해짐
function에도 spread를 사용할 수 있음 (코드를 깔끔하게 만들면서 가독성을 높일 수 있다)
function foo(hed, ...rest) {
console.log(head)
console.log(rest)
}
// parameter에도 사용하여 다양하게 사용 가능