ES6에서 강화된 함수의 기능.(Named parameter , Arrow Function)

Named parameter

ES6부터 함수 매개변수에 기본값을 줄 수 있다.

매개변수에 기본값 주기.


function printLog(a=1){
	console.log({ a });
}
printLog(); // { a:1 }

인수 없이 함수를 호출하므로, a에는 undefined가 입력된다. 기본값이 정의된 매개변수에 undefined를 입력하면 정의된 기본값1이 사용된다.

매개변수 기본값으로 함수 호출 사용하기.


function getDefault() {
	return 1;
}
function printLog(a = getDefault()){
	console.log({ a });
}
printLog(); // { a: 1 }

매개변수 기본값을 이용해서 필숫값을 표현하는 방법.


function required() {
	throw new Error('no parameter');
}
function printLog(a = required()) {
	console.log({a});
}
printLog(10); // { a: 10 }
printLog(); // no parameter

매개변수의 값이 존재하면 required 함수는 호출되지 않는다.

나머지 매개변수


function printLog(a, ...rest){
	console.log({ a, rest });
}
printLog(1, 2, 3); // { a: 1, rest: [2,3] }

arguments 키워드로 나머지 매개변수 따라 하기.


function printLog(a){
	const rest = Array.from(arguments).splice(1);
	console.log({a, rest});
}
printLog(1, 2, 3); // { a: 1, rest: [2, 3] }

가독성이 좋지 않으므로, 나머지 매개변수를 사용한 방식이 더 낫다.

명명된 매개변수의 사용 여부에 따른 가독성 비교


const numbers = [10, 20, 30, 40]
const result1 = getValues(numbers, 5, 25);
const result2 = getValues({ numbers, greaterThan: 5, lessThan: 25 });

명명된 매개변수의 사용 여부에 따른 선택적 매개변수 코드 비교.


const result1 = getValues(numbers, undefined, 25); // 필요없는 매개변수 자리에 undefined를 넣으면 된다. -> 관리가 힘듬.
const result2 = getValues({ numbers, greaterThan: 5 });
const result3 = getValues({ numbers, lessThan: 25 });

Arrow Function

화살표 함수의 사용 예


const add = (a, b) => a + b;
console.log(add(1,2)); // 3
const add5 = a => a + 5;
console.log(add5(1)); // 6
const addAndReturnObject = (a, b) => ({ result: a + b });
console.log(addAndReturnObject(1, 2).result); // 3

코드가 두 줄 이상인 화살표 함수


const add = (a, b) => {
	if (a <= 0 || b <= 0){
	throw new Error('must be positive number');
	}
	return a + b;
}