【jq源码探秘】— js如何实现实现重载

大家都知道js是没有重载的,但是通过某种方式是可以实现的,下面就是jq的实现方式:

    /*给某个对象添加方法的函数*/
    function addMethod(object, name, fn) {
        var old = object[name];
        //第一次old是 undefined
        object[name] = function() {
            //如果调用函数的参数长度等于fn的参数长度,那就返回当前函数
            if (fn.length == arguments.length) {
                return fn.apply(this, arguments);
            } else if (typeof old == 'function') {
            //如果当前的调用不匹配那么调用上一次的old,直到匹配为止
                return old.apply(this, arguments); 
            }
        }
    }
    var people = ['1', '2', '3'];
    addMethod(people, 'finds', function() {
        return 0;
    })
    addMethod(people, 'finds', function(firstname) {
        return 1;
    })
    addMethod(people, 'finds', function(firstname, lastname) {
        return 2;
    })
    console.log(people.finds('1', '2'))
    console.log(people.finds());
    console.log(people.finds('1'));
复制代码

凭直觉，函数重载可以通过if…else或者switch实现，这就不去管它了。jQuery之父John Resig提出了一个非常巧(bian)妙(tai)的方法，利用了闭包。

people.find事实上只能绑定一个函数，那它为何可以处理3种不同的输入呢？它不可能同时绑定3个函数find0,find1与find2啊！这里的关键在于old属性。 由addMethod函数的调用顺序可知，users.find最终绑定的是find2函数。然而，在绑定find2时，old为find1；同理，绑定find1时，old为find0。3个函数find0,find1与find2就这样通过闭包链接起来了。 根据addMethod的逻辑，当fn.length与arguments.length不匹配时，就会去调用old，直到匹配为止。

转载于:https://juejin.im/post/5c4925ce6fb9a049e82bdf50