[Javascript] 함수(2)

반환값

함수 내에서 수행된 결과를 return 키워드를 이용하여 반환할 수 있으며 반환된 값을 반환값이라 한다. 배열 등을 이용하여 한 번에 여러 개의 값을 반환할 수 있다.

function sum(s1, s2) {
    var result = s1 + s2;
    return result;
}

console.log(sum(10, 20));  // 30

function mul(m1, m2, m3) {
    var result1 = m1 * m2;
    var result2 = m1 * m2 * m3;
    return [result1, result2];
}

console.log(mul(2,2,4));  // [4, 16]
console.log(mul(2,2,4)[0]);  // 4
console.log(mul(2,2,4)[1]);  // 16

함수 프로퍼티

기본적으로 제공되는 함수 프로퍼티이다.

arguments

arguments 객체는 함수 호출 시에 전달된 인수들의 정보를 가지고 있는 유사 배열 객체이며, 함수 내부에서 지역변수처럼 사용된다.

function arg(x) {
    console.log(arguments);
}

console.log(arg());      // {}
console.log(arg(1));     // {'0' : 1}
console.log(arg(1, 2));  // {'0' : 1, '1' : 2}

다음과 같이 매개변수의 갯수가 정해져있지 않은 가변 인자 함수를 구현할 때 유용하다.

function sumAll() {
    // arguments.length : 함수 호출 시 입력된 매개변수의 갯수
    console.log(typeof(arguments) + ' : ' + arguments.length);
}

sumAll(1,2,3,4,5);  // object : 5

function sumAll() {
    var output = 0;
    for (var i=0; i<arguments.length; i++) {
        output += arguments[i];
    }
    console.log(output);
}

sumAll(1,2,3,4,5);  // 15

length

함수 정의 시 선언된 매개변수의 갯수를 의미한다.

function one(arg1) {
    console.log('one.length : ' + one.length);
}

one('var1', 'var2');    // one.length : 1

name

함수명을 의미한다. 익명함수의 경우 함수명이 없으므로 변수명을 값으로 한다.

var f1 = function sum(a, b) {
    return a + b;
}

var f2 = function(a, b) {
    return a + b;
}

function sum(a, b) {
    return a + b;
}

console.log(f1.name);   // sum
console.log(f2.name);   // f2
console.log(sum.name);  // sum

caller

자신을 호출한 함수를 의미한다.

function f() {
    f1();
}

function f1() {
    console.log("caller :" + f1.caller);
}

console.log(f());   // caller : function f() { f1(); }
console.log(f1());  // caller : null

내부함수

함수 내부에 정의된 함수를 내부함수라 하며 외부에서 접근할 수 없다.

function outter() {
    var title = 'coding everyday';

    function inner() {
        console.log(title);
    }
    inner();
}

outter();   // coding everyday
inner();    // inner is not defined

콜백 함수

명시적으로 호출하는 방식이 아닌 특정 시점/이벤트가 발생했을 때 호출되는 함수를 콜백함수라 한다. 또한, 특정 함수의 인자로 넘겨 코드 내부에서 호출되는 함수 역시 콜백 함수가 될 수 있다.

function call(a, b, callback) {
    var mul = a * b;
    callback(mul);  // callback 함수 실행
}

var callback = function (mul) {
    console.log(mul)
}

call(2, 3, callback);   // 6

callback 함수는 call 함수 내에서 호출되는 시점에 호출되는 콜백 함수이다.

function func() {
    function f() {
        console.log("함수 실행");
    }
    return f;
}

var myf = func();   // func() 함수의 리턴 값인 f 함수가 전달된다. 
myf();  // "함수 실행"

f 함수는 리턴된 후 myf() 호출 시점에 호출되는 콜백 함수이다.

function call(a, b) {
    var mul = a * b;
    return mul;
}

var callback = function (mul) {
    console.log(mul)
}

callback(call(2, 3));   // 6

위와 같이 만약 콜백 함수를 사용하지 않고 순차적으로 함수를 호출한다면 call 함수가 실행 완료된 후에야 callback 함수가 실행되므로 call 함수가 실행 완료될 때까지 기다려야 한다. 만약 웹사이트에서 call 함수의 실행이 길어진다면 웹사이트가 멈춰버릴 수 있다.