어제의 나보다 성장한 오늘의 나

[자바스크립트] default parameter 본문

공부/JavaScript && jquery

[자바스크립트] default parameter

NineOne 2021. 4. 26. 23:48

자바스크립트는 타입이 없는 자유로운 언어이다. 그렇다면 함수의 인자로 내가 원하는 값이 안 왔을 때? 어떻게 처리할까? ES6 이전에는 다음과 같이 썼다.

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

x 인자가 undefined가 아니라면 그대로 x값 아니면 3을 저장해주고, y도 typeof로 확인하는 모습이다.

하지만 저렇게 일일이 확인하면 귀찮을 것이다. 그래서 ES6에서는 다음과 같이 쓰면 undefined를 처리해준다.

const f = function (a = 1, b = 2, c = 3, d = 4, e = 5, f = 6) {
  console.log(a, b, c, d, e, f)
}
f(7, 0, "", false, null)
f(undefined,undefined,undefined,undefined,undefined,undefined,)

따라서 undefined 혹은 누락된 파라미터에 대해서 작동한다.

다른 방향으로 식을 적용할 수 있다.

const f = function (x = 1, y = 3 + x) {
  console.log(x, y)
}
f()	// 1, 4

하지만 다음과 같이 선언하면 작동하지 않는다.

const f = function (x = 1, y = 3 + z, z = 4) {
  console.log(x, y)
}
f()	// z is not defined

위를 보면 바로 알 수 있을 것이다. 그렇다 인자들은 차례대로 생성되고 할당되는데 z는 아직 할당이 안된 것이다. 따라서 순서가 중요하다는 걸 알 수 있다.

그렇다는 건 함수도 올 수 있다는 것이다!

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

 

출처

Comments