15. Javascript 함수형 프로그래밍 적용(2) - bind

 

 

bind 함수에 대해서도 한번 살펴보겠습니다. bind 함수는 기본적으로 curry와 그 용도가 비슷한 함수입니다. 고정하고자 하는 인자 값을 bind 호출 시 넘겨주고, 거기서 클로저로 반환받은 함수를 호출하면서 사용자가 나머지 가변 인자를 지정할 수 있는 방식을 지원합니다. curry와 다른 점은, 함수 호출 시 this에 바인딩할 객체를 직접 지정할 수 있다는 점이죠. curry를 충분히 대체하는 함수입니다. 

 

Function.prototype.bind = function(thisArg) {
    var fn = this;
    var slice = Array.prototype.slice;
    var args = slice.call(arguments, 1);
    // bind의 파라미터 값 중 인덱스 1번 부터 전부 args 배열로

    return function() {
        return fn.apply(thisArg, args.concat(slice.call(arguments)));
    };
}

var print_all = function(arg) {
    console.log('\n' + arguments);

    for (var i in this) {
        console.log("this " + i + " : " + this[i]);
    }

    for (var i in arguments) {
        console.log("arguments " + i + " : " + arguments[i]);
    }
}

var myobj = { 
    name : "han",
    age : 20
};

var myfunc = print_all.bind(myobj);
myfunc();

var myfunc1 = print_all.bind(myobj, "richey", "show");
myfunc1("JPHOLE");

/* 결과
[object Arguments]
this name : han
this age : 20

[object Arguments]
this name : han
this age : 20
arguments 0 : richey
arguments 1 : show
arguments 2 : JPHOLE

*/

 

코드의 구성은 기본적으로 앞서 살펴본 curry와 유사합니다. 여기서 myfunc( )라는 함수는 결국 myobj를 this에 바인딩하여 print_all 함수를 실행하게 됩니다. myfunc1( )의 경우에는 전달된 인자 값도 모두 포함해 실행하게 됩니다.