JavaScript 스프레드 연산자 ( Spread operator, ES6 )

스프레드 연산자(...)

배열 리터럴의 일부를 반복 가능한 식(다른 배열 리터럴 등)에서 초기화하거나

식을 함수 호출에서 여러 인수로 확장할 때 사용

 

구문

const array = [[arg0ToN ,] ...iterable [, arg0ToN]]
func([args ,] ...iterable [, args | ...iterable])

 

매개 변수

iterable
필수.반복 가능한 개체

arg0ToN
선택 사항이며 하나 이상의 배열 리터럴 요소

args
선택 사항이며 함수에 대한 하나 이상의 인수

 

설명

다음 코드 예제에서는 스프레드 연산자와 concat 메소드를 비교하며 설명

let a, b, c, d, e;
a = [1,2,3];
b = "dog";
c = [42, "cat"];

// concat method.
d = a.concat(b, c);

// Using the spread operator.
e = [...a, b, ...c];

console.log(d);
console.log(e);

// Output:
// 1, 2, 3, "dog", 42, "cat"
// 1, 2, 3, "dog", 42, "cat"

 

함수 호출에서 스프레드 연산자를 사용하는 방법

두 개의 배열 리터럴이 스프레드 연산자를 사용하여 함수로 전달되며 배열은 여러 인수에 확장됨.

apply 메소드의 역할을 짧은 코드로 작성 가능.

const f = (a, b, c, x, y, z) => (a + b + c + x + y + z);

const args = [1, 2, 3];
console.log(f(...args, 4, ...[5, 6]));

// Output:
// 21

const f = (a, b, c) => (a + b + c);

const args = [1, 2, 3];

// apply
f.apply(this, args);
// spread operator
f(...args);

// Output:
// 6
// 6

 

Reference

https://msdn.microsoft.com/ko-kr/library/dn919259(v=vs.94).aspx