default parameter

default parameter란 무엇인가?

함수로 넘어오는 인자에 기본값을 지정해줄 수 있는것을 말한다.

기본값을 정해주지 않았을때

예시1(기본값을 지정해줄 수 없을때)

const f = function (x, y, z) {
    x = x ? x : 4 //x가 truethy면 x, 아니면 4
    y = y || 5 // y가 truthy면  y, 아니면 5
    if (!z) {
      z = 6
    } // z가 falthy면 z에 6을 넣어라
    console.log(x, y, z)
  }

  f(1) // 1 5 6
  
  f(0, null) // 4 5 6

특징

• 매개변수 x, y, z에 기본값을 정해줄 수 없으니 if문을 활용해서 기본값을 지정해줘야 한다.
• 여기서는 0과 null는 falthy한 값을 표현해 줄 수 없다.

예시2(falthy값 표현)

const f2 = function (x, y, z) {
    x = x !== undefined ? x : 3
    y = typeof y !== "undefined" ? y : 4
    console.log(x, y, z)
  }
f2(0, null) // 0 null undefined

특징

• undefined만 걸러낼 수 있다.
  null과 0등의 falthy값은 표현할 수 있지만 undefined는 표현할 수 없다.
• 매개변수를 아무것도 넣지 않으면 undefined가 나온다.

기본값을 정해주었을때

예시

const f3 = (x = 4, y = 5, z = 6) => {
      console.log(x,y,z);
  }
  f3(null, 0, undefined);

특징

• falthy값을 넣었을때 falthy값이 그대로 출려된다.
• undefined를 넣으면 기본값이 출력된다.

---

동작원리

예시1(기본값 설정 안했을때)

function A (a, b, c) {
  console.log(a, b, c)
}

a(1, 2, 3)

위를 실행하면 다음과 같다.

function A (a, b, c) {
    var a = 1;
    var b = 2;
    var c = 3;
  	console.log(a, b, c) // 1 2 3
}

a(1, 2, 3)

a, b, c를 var로 선언하는 것과 같다.
var로 선언하므로 값도 동시에 할당된다.

예시2(기본값 설정 했을때)

function A (a = 1 , b = 2, c = 3) {
  let _a = a !== undefined ? a : 1;
  let _b = b !== undefined ? b : 2;
  let _c = c !== undefined ? c : 3;  
}

A()에 기본값을 할당하는 순간 각각의 요소들은 위와같은 과정을 거치게 된다.

예시3(기본값 설정 했을때)

function A (a = 1, b = c + 1, c = 4) {
    console.log(a, b, c);
};

A();
결과값
ReferenceError: Cannot access 'c' before initialization

기본값을 설정하면 TDZ가 설정되므로 순서가 중요하다.
그러므로 위와같이 b가 먼저 선언되었으므로 c를 넣을 수 없다.

예시4(함수를 기본값으로 넣을때)

const getDefault = function () {
    console.log('getDefault Called.')
    return 10
  }
  const sum = function (x, y = getDefault()) {
    console.log(x + y)
  }
  sum(1, 2) // 3
  sum(1) // getDefault Called.
		 //	11

위와같이 기본값을 함수로도 지정할 수 있다.