기본값·나머지 매개 변수

넘기지 않아도 되게 만듭니다

매개 변수를 넘기지 않으면 그 자리는 undefined 가 됩니다. 그때 대신 쓸 값을 미리 정해 둘 수 있습니다. 이것을 기본값 매개 변수 라고 합니다.

반대로 몇 개가 올지 모를 때 도 있습니다. 그때는 나머지를 한꺼번에 받습니다.

기본값 정해 두기

function greet(name, greeting = "안녕하세요") {
	return `${name}님, ${greeting}`;
}

console.log(greet("홍길동"));
console.log(greet("김철수", "반갑습니다"));

기본값이 있는 매개 변수는 뒤쪽에 둡니다. 앞에 두면 그것을 건너뛰고 뒤엣것만 넘길 방법이 없습니다.

기본값이 쓰이는 때

넘기지 않았을 때만 쓰입니다. undefined 를 직접 넘겨도 기본값이 쓰이지만, null 이나 빈 글자는 그대로 들어갑니다.

function show(text = "기본값") {
	console.log(text);
}

show();
show(undefined);
show(null);
show("");

셋째 줄은 null, 넷째 줄은 빈 글자가 그대로 나온 것입니다. 빈 글자는 눈에 보이지 않아 빈 줄처럼 보입니다.

나머지를 한꺼번에 받기

매개 변수 앞에 점 셋을 붙이면 넘어온 나머지 값들이 한 덩어리로 들어옵니다. 이 덩어리를 배열(array) 이라고 하며 3부에서 자세히 다룹니다. 여기서는 length 로 개수를 알 수 있고 [0] 처럼 번호로 꺼낼 수 있다는 것만 사용합니다.

function total(...prices) {
	console.log(`받은 개수: ${prices.length}`);

	let sum = 0;
	for (let i = 0; i < prices.length; i++) {
		sum += prices[i];
	}
	return sum;
}

console.log(total(1000, 2000));
console.log(total(1000, 2000, 3000));

번호는 0부터 셉니다. 1.5 의 문자열 자르기와 같은 규칙입니다.

앞의 것은 따로 받기

나머지 매개 변수 앞에 보통의 매개 변수를 둘 수 있습니다. 앞에서부터 채우고 남는 것이 덩어리로 들어갑니다.

function order(customer, ...items) {
	console.log(`${customer}님이 ${items.length}개를 주문했습니다`);
	console.log(`첫 상품: ${items[0]}`);
}

order("홍길동", "연필", "공책", "지우개");

처음에 자주 걸리는 것

function greet(greeting = "안녕", name) { }   // 쓰기 불편합니다

SyntaxError: Rest parameter must be last formal parameter

직접 해보기

이 단원의 정리