래퍼 함수

커링패턴과 비슷한듯 다른듯한 래퍼함수. (상관없다 둘다 해석하기 존나 어려우니깐.)

10복잡한 래퍼함수의 예

function wrap(object, method, wrapper){
    var fn = object[method];
    return object[method] = function(){
        return wrapper.apply(this, [fn].concat(Array.prototype.slice.call(arguments));
    }
}

Function.prototype.original = function(value){
    this.value = value;
    console.log("value : " + this.value);
}

var mywrap = wrap(Function.prototype, "original", function(orig_func, value){
    this.value = 20;
    orig_func(value);
    console.log("wrapper value: " + this.value);
});

var obj = new mywrap("minwoo");

mywrap 이라는 생성자에"minwoo"를 넣고 obj를 초기화 했다. mywrap은 wrap함수다.

wrap함수는 object, method, wrapper 총 3개의 인자를 받는다. mywrap을 초기화 할때에는 함수객체의 프로토타입, 문자열("original") 그리고 두개의 인자를 받는 함수, 총 3개의 인자를 받았다.

function wrap(object, method, wrapper){
    var fn = object[method];
    //fn에 Function.prototype.original을 넣고
    //여기서 다시 초기화하며 반환한다.
    return object[method] = function(){
        return wrapper.apply(this, 
            [fn].concat(Array.prototype.slice.call(arguments));
    }
}

wrap는 object[method]를 반환 하는데, 이것은 Function.prototype["original"] 이 아니라 새로 반환한 함수이다. 이 함수에 "minwoo"가 전달된다. 이함수의 반환값으로 wrap함수의 세번째 인자였던 wrapper함수를 실행하는데, wrapper함수에는 배열이 전달된다.

wrapper.apply(this, [fn].concat(Array.prototype.slice.call(arguments));
//[fn, "minwoo"]

wrapper함수는 이런모양이다. 인자로 받은 배열중 fn이 orig_func으로 대입되고, value는 "minwoo"이다.

function(orig_func, value){
    this.value = 20;
    orig_func(value);
    console.log("wrapper value: " + this.value);
}

fn은 Function.prototype.original이고 이 함수는 인자를 하나 받아 콘솔을 출력하기 때문에 value : miwnoo 가 출력된다.

마지막으로 wrapper함수의this.value를 콘솔에 대입 wrapper value: 20 을 출력하고 끝난다.

그나마 쉽게 느껴지는 커링패턴

(function(){
    Function.prototype.curry = function(){
        if(arguments.length<1){
            return this;
        }
    }
    var _this = this,
        args = Array.prototype.slice.apply(arguments);

    return function(){
        return _this.apply(this,
            args.concat(Array.prototype.slice.apply(arguments)));
    }

    function sum(x,y){
        return x+y;
    }

    var adderFourCurry = sum.curry(4);
    console.log(adderFourCurry(5)); // === 9
    //console.log(sum.curry(4)(5)); // === 9 약간 리액트에서 많이나오는 
})();