[ES6]default parameter

함수에서 파라미터를 다룰 때 사용 할 수 있는 기술을 알아보자

default parameter

const f1 = function(x, y, z) {

console.log(x, y, z);

};

이러한 함수가 있다고 가정할 때

f1(0, null);

이러한 값을 불러온다고 치자

x는 0을 불러왔기 때문에 0을 리턴할 것이고

y는 null을 불러왔기 때문에 null을 리턴할 것이고

z 는 아무것도 불러오지 않았기 때문에 undefinded가 리턴 될 것이다.

그런데 아무것도 불러오지 않았을 때의 기본값을 주고 싶다면

다음과 같이 만들 수 있 을것이다.,

const f2 = function(x, y, z) {

x = x ? x : 4;

y = y || 5;

if (!z) {

z = 6;

}

console.log(x, y, z);

};

f2(0, null);

x가 true(값을 가진다면) x 아니면 4

y가 true(값을 가진다면) y 아니면 5

z가 true(값을 가진다면) z 아니면 6

그런데 결과는 

x = 4 y = 5 z = 6을 가진다

왜냐하면 0과 null은 false를 가지기 때문에

그래서 다음과 같이 코드를 고친다.

const f3 = function(x, y, z) {

x = x !== undefined ? x : 4;

y = typeof y !== "undefined" || 5;

if (!z) {

z = 6;

}

console.log(x, y, z);

};

f3(0, null);

결과는 예상했듯이

0 null 6이다.

es6에선 이러한 복잡한 코드를 단순히 구현한다.

const f4 = function(x = 4, y = 5, z = 6) {

console.log(x, y, z);

};

rest parameter

파라미터가 정해진 값보다 많은 값이 들어왔을 때 사용된다.

function f(x, y) {

var rest = Array.prototype.slice.call(arguments, 2);

console.log(rest);

}

f(1, 2, true, null, undefined, 10);

다음 함수를 보면

f의 파라미터는 6개인데

아규먼트는 2가지 뿐이다.

이 나머지들을 관리하기 위해서

arguments라는 유사배열 형태의 객체를 관리해야했다

그런데 es6에선 다음과 같이 처리된다.

function f(x, y, ...z) {

console.log(z);

}

f(1, 2, true, null, undefined, 10);