[JavaScript] 인수 표기법과 함수 호출과 반환값

 

 

ES2015 인수 표기법

 

 

 인수의 디폴트 값

인수의 디폴트값을 선언하려면, '가인수 = 디폴트값'의 형식으로 가인수를 선언할 수 있다. 

function plusF(a = 3, b = 8) {
    console.log(a+b);
}

plusF();      // 11

 

+ 디폴트값 사용시 주의사항이 있다.

 

① null 값이 인수로 넘어왔을 때 디폴트값으로 대체되지 않는다. null 이 그대로 사용된다.

function plusF(a = 3, b = 8) {
    console.log(a+b);
}

plusF(null, null);      // 0

 

② undefined(미정의) 값은 디폴트 값으로 대체된다.

function plusF(a = 3, b = 8) {
    console.log(a+b);
}

plusF(2, undefined);      // 10

 

③ 디폴트값을 갖는 가인수는 인수 리스트의 끞에서 선언해야 한다.

이것이 필수는 아니지만 혼동이 있으므로 리스트의 끝에 선언하는 것이 좋다. 다음 예시의 a 값이 2가 되고 b의 값은 정의되지 않았기 때문에 NaN이라는 결과가 출력된다.

function plusF(a = 3, b) {
    console.log(a+b);
}

plusF(2);      // NaN

 

 

 가변길이 인수의 함수 정의하기(ES2015)

가인수의 앞에 ...(점3개)를 부여하면 가변길이 인수가 된다. 건네진 임의의 개수의 인수를 배열로 모아 취하는 기능이다.

function plusL(str, ...nums) {
    console.log(str);

    let result = 0;
    for(let value of nums) {
        result += value;
    }

    return result;
}

console.log(plusL("1~7의 합은?", 1, 2, 3, 4, 5, 6, 7));

 

 

 '...' 연산자에 의한 인수의 전개

... 연산자를 사용하여 배열을 각각의 함수의 실인수 값으로 전개할 수 있다.

function plusL(...nums) {
    let result = 0;
    for(let value of nums) {
        result += value;
    }

    return result;
}

var numList = [1, 2, 3, 4, 5, 6, 7];

console.log(plusL(1, 2, 3, 4, 5, 6, 7));      // 28
console.log(plusL(...numList));               // 28

 

 

 개별 인수로 함수 값 정의하기

"{ 프로퍼티 = 디폴트값, ... }" 과 같은 형태로 선언함으로써 객체로서 건네진 인수를 분해해 함수 내에서 개별 인수로 액세스할 수 있다. 순서에 상관없이 이름으로 인수를 특정할 수 있다.

function plusL({a = 1, b = 1}) {
    console.log(`a : ${a} , b : ${b}`);
    return a + b;
}

plusL({b: 3, a: 8});

 

+ 특정 프로퍼티만을 추출할 경우

function myLog({name}) {
    console.log(name);
    return;
}

let pet = {
    name: '퍼피',
    color: '빨간색',
    age: 13
}

myLog(pet);

 

 

함수 호출과 반환값

 

 

 복수의 반환값을 개별 변수에 대입하기

함수의 리턴값을 복수의 값을 반환하고 싶을 때 "return x, y;"와 같이 구문을 작성할 수 없다. 배열이나 객체로 값을 하나로 모은 후에 단일 값을 반환할 필요가 있다.

function getMaxMin(a, b) {
    return [Math.max(a, b), Math.min(a, b)];
}

// 배열로 받을 경우
let results = getMaxMin(20, 40);

// 개별 변수로 받을 경우
let [maxValue, minValue] = getMaxMin(20, 40);

// 최솟값만 반환하고 싶은 경우
let [, minOnlyValue] = getMaxMin(20, 40);

console.log(results);    // [40, 20]
console.log(`${maxValue} , ${minValue}`);   // 40 , 20
console.log(minOnlyValue);    // 20

 

 

 재귀 함수(Recursive Function)

재귀 함수란 어떤 함수가 자기 자신을 호출하는 것 또는 그러한 함수 자체를 말한다.

function factorial(n) {
    if(n != 0) {return n * factorial(n - 1);}
    return 1;
}

console.log(factorial(5));     // 120

 

 

 고차 함수(Higher-order function)

자바스크립트에서 함수는 데이터형의 일종이다. 함수를 인수나 반환값으로서 취급하는 함수를 고차함수라고 부른다.

// 고차함수 arrayWal 정의
function arrayWal(data, func) {
    for(var key in data) {
        func(data[key], key);
    }
}

function showElement(value, key) {
    console.log(key + " : " + value);
}

arrayWal([10, 20, 30, 40, 50], showElement);

 

 

+ 익명함수(함수 리터럴)로 표현하기

function arrayWal(data, func) {
    for(var key in data) {
        func(data[key], key);
    }
}

arrayWal([10, 20, 30, 40, 50], 
    function (value, key) {
    console.log(key + " : " + value);
});