如何在javascript中重载?

how to do overloading in javascript?

本问题已经有最佳答案,请猛点这里访问。

我正在尝试学习JavaScript中的重载。我在谷歌上搜索了一下,有一种方法可以做到这一点:使用arguments的长度,然后添加开关条件。但我对这样做不感兴趣。实际上,我看到一个很好的答案javascript中的函数重载——最佳实践,但他没有给出任何使用他的观点进行重载的例子。那么,如何在JavaScript中进行重载呢?

这是我的密码。我需要使用上面的解决方案来重载一个方法。他说要这样做:http://jsfiddle.net/m84fg8ac/

1
2
3
4
5
6
7
function foo(a, b, opts) {

}


foo(1, 2, {"method":"add"});
foo(3, 4, {"test":"equals","bar":"tree"});

我将如何在代码中实现这一点?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
function foo(a, b, opts) {

}

function foo(a) {
    console.log("one argument pass");
}

function foo(a, b) {
    console.log("two argument pass");
}

function foo(a, b, c) {
    console.log("three argument pass");
}


foo(1);
foo(1,2);
foo(1,2,3);

这里写着使用参数进行函数重载的最佳方法是不要检查参数长度或类型;检查类型只会使代码变慢,并且可以享受数组、空值、对象等的乐趣。大多数开发人员所做的就是将对象作为方法的最后一个参数。这个物体可以容纳任何东西。


来自http://ejohn.org/blog/javascript-method-overloading/

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
var namespace = {};

function addMethod(object, name, fn) {
    var old = object[name];
    object[name] = function() {
        if (fn.length === arguments.length) {
            return fn.apply(this, arguments);
        } else if (typeof old === 'function') {
            return old.apply(this, arguments);
        }
    };
}

addMethod(namespace,"foo", function (a) {
    console.log("one argument pass");
});

addMethod(namespace,"foo", function (a, b) {
    console.log("two arguments pass");
});

addMethod(namespace,"foo", function (a, b, c) {
    console.log("three argument pass");
});

namespace.foo(1);
namespace.foo(1, 2);
namespace.foo(1, 2, 3);

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
var namespace = {};

function addMethod(object, name, fn) {
    var old = object[name];
    object[name] = function() {
        if (fn.length === arguments.length) {
            return fn.apply(this, arguments);
        } else if (typeof old === 'function') {
            return old.apply(this, arguments);
        }
    };
}

addMethod(namespace,"foo", function (a) {
    document.write("one argument pass<br/>");
});

addMethod(namespace,"foo", function (a, b) {
    document.write("two arguments pass<br/>");
});

addMethod(namespace,"foo", function (a, b, c) {
    document.write("three argument pass<br/>");
});

namespace.foo(1);
namespace.foo(1, 2);
namespace.foo(1, 2, 3);


JavaScript不需要在调用函数时传递所有参数,因此可以实现如下重载:

1
2
3
4
5
6
7
8
9
10
function foo(a, b, c) {
    if (c === undefined) {
        if (b === undefined) {
            if (a === undefined) console.log("zero argument pass");
            else console.log("one argument pass");
        }
        else console.log('two argument pass');
    }
    else console.log('three argument pass');
}


检查数量

1
2
3
4
5
6
7
8
9
10
11
12
13
function foo(a, b, opts) {
    if (arguments.length === 1) {
        console.log("one argument pass")
    } else if (arguments.length === 2) {
        console.log("two argument pass")
    } else if (arguments.length === 3) {
        console.log("three argument pass")
    }
}

foo(1); //"one argument pass"
foo(1,2); //"two argument pass"
foo(1,2,3); //"three argument pass"

http://jsfiddle.net/m84fg8ac/2/