[JS] 전개 연산자와 기본 매개변수 사용

함수에 매개변수로 숫자도 들어오지만 배열 형태로도 들어 올 수 있습니다.

 

뿐만 아니라, 함수 형태로도 받을 수 있습니다.

 

여기에서는 배열을 전개하여 함수의 매개변수로 전달해주는 전개 연산자에서 알아보겠습니다.

 

전개 연산자

---

 

간단한 예제로 차이점을 확인하겠습니다.

 

const array = [1,3,5,7,9];

const spreadOperator = (...items) => {
    console.log(items);
}

spreadOperator(array); // 배열안에 배열이 들어옴 [[1,3,5,7,9]]
spreadOperator(...array); // 배열형태로 들어옴 [1,3,5,7,9]

 

전개 연산자를 사용한 것과 사용하지 않는 차이점을 확인 할 수 있습니다.

 

사실 제가 이해한 건 아래의 코드로 쉽게 이해되었습니다.

 

const numbers = [1, 2, 3];

console.log(...numbers); // 1,2,3

 

변수의 값이 배열형태로 받아왔을 때, 나머지 매개변수로 사용하면

 

각 배열의 값들을 꺼내서 나온다는 느낌이였습니다.

 

 MDN 공식 문서에서도 전개 구문으로 예제가 있으니 참고 바랍니다.

전개 구문 - JavaScript | MDN

 

기본 매개변수

---

 

 

const 함수이름 = (매개변수, 매개변수, 매개변수 = 기본값, 매개변수=기본값) => { }

 

매개변수는 왼쪽부터 입력하기 때문에, 기본 매개변수는 오른쪽 매개변수에 사용을 권장합니다.

 

기본 매개변수에는 값이라면 무엇이든지 들어갑니다.

 

const defaultParameter = (a=10, b = new Date()) => {
    console.log("매개변수 기본값1: " + a);
    console.log("매개변수 기본값2 날짜: " + b);
}

defaultParameter();

// 결과

매개변수 기본값1: 10
매개변수 기본값2 날짜: Thu Jan 28 2021 11:32:53 GMT+0900 (Korean Standard Time)

 

기본값 매개변수 - JavaScript | MDN