[JavaScript / ES6] default parameter / arguments

💡 실습 포인트!

💜 default parameter

🤍 기본 함수 스타일

function add(a, b) {
    console.log(a + b);
}

add(1, 2); // 3

---

🤍 JavaScript 함수의 특성

function add1(a, b) {
    console.log(a);
}

add1(1); // 1

• 파라미터가 2개여도 함수 내에서 사용한 파라미터가 a 하나라면, 실제로 함수를 사용할 때 파라미터 하나만 넣어도 에러가 발생하지 않는다.

---

🤍 default parameter 알아보기

function add2(a, b = 10) {
    console.log(a + b);
}

add2(); // NaN
add2(1); // 11
add2(1, 2); // 3

• 파라미터에 값을 입력하지 않았을 때 기본으로 사용하는 값을 default parameter 라고 하며 등호를 사용하면 된다.

 

function add3(a, b = 2 * 5) {
    console.log(a + b);
}

add3(1); // 11

• default parameter 에는 숫자 외에 수학 연산자도 사용이 가능하다.

 

function add4(a, b = 5 * a) {
    console.log(a + b);
}

add4(1); // 6

• default parameter 에는 숫자 외에 파라미터를 재활용하여 연산도 사용이 가능하다.

 

function tempfunc() {
    return 20;
}

function add5(a, b = tempfunc()) {
    console.log(a + b);
}

add5(1); // 21

• default parameter 에는 함수 사용이 가능하다.

---

💜 arguments

🤍 arguments 알아보기

function func(a, b, c) {
    console.log(arguments);
}

func(1, 2, 3); // Arguments(3) [1, 2, 3, callee: ƒ, Symbol(Symbol.iterator): ƒ]

• 모든 파라미터를 한꺼번에 다루고 싶은 경우 arguments 를 사용한다.

 

function func1(a, b, c) {
    console.log(arguments[0], arguments[1], arguments[2]);
}

func1(1, 2, 3); // 1 2 3

• arguments 는 모든 파라미터들을 array 와 유사하게 만들어준다.

 

function func2(a, b, c) {
    for (let i = 0; i < arguments.length; i++) {
        console.log(arguments[i]);
    }
}

func2(1, 2, 3); // 1 2 3 이 콘솔창에 한 줄씩 출력!

• 입력한 파라미터를 손쉽게 콘솔창에 각각 출력해주는 것이 가능하다.