[JavaScritp] Spread syntax (...) 전개 구문

오늘은 Spread syntax (...) 전개 구문에 대해서 알아보고자 한다. 

전개 구문을 사용하면 함수에 인수로 배열이나 문자열 같은 반복 가능한 값들을 하나씩 넣어준다고 생각하면 된다.

 

특히 매개변수로 인수를 여러개 넣어주고 싶을 때 또는 동적으로 매개변수를 넣고 싶을 때 전개 구문을 사용하면 좋다.

 

처음 보는 문법이라 조금 헷갈렸지만 예제를 보면서 이해했다.

 

// 기본 사용법이다.
// myFunction(...iterableObj);

let num = [1, 2, 3, 4];
console.log(...num); // 1, 2, 3, 4

function myNum(x, y){
  if(x > y)
    return x;
  else 
  	return y;
}

console.log(myNum(...num)); // num[0], num[1]이 들어가 2가 출력된다. 

function myNum2(x, y, z){
  let max = x;
  if(max < y)
    max = y;
  if(max < z)
    max = z;
  return max;
}

console.log(myNum2(...num)); // num[0], num[1], num[2]가 들어가 3이 출력된다. 

 

이런식으로 사용된다.  MDN에서 예제를 살펴보면 

 

function sum(x, y, z) {
  return x + y + z;
}

const numbers = [1, 2, 3];


console.log(sum(...numbers));
// expected output: 6

console.log(sum.apply(null, numbers));
// expected output: 6

 

이런 코드들이 나오는데 배열을 함수의 인자로 넣어서 전달인자에 하나씩 대입해주는 것이라 이해했다.

 

아직은 좀 어렵지만 뒤에나오는 apply() 를 정리하면서 다시 공부할 것이다.