Question

我有以下两个功能：

function mvcOnFailure(message) {

    $.modal({
        title: "MVC Error",
        closeButton: true,
        content: message,
        ...
    });
}

function ajaxOnFailure(ajaxContext) {

    $.modal({
        title: "Ajax Error",
        closeButton: true,
        content: ajaxContext.responseText,
        ...
    });
}

他们都做同样的事情（省略了一些行），但采取不同的论点。有什么方法可以组合这些功能。我想的是以某种方式有一个函数来完成大部分工作，比如打开对话框，然后让另外两个函数从中继承。

Answer 1

我在想的是以某种方式有一个函数来完成大部分工作，比如打开对话框，然后让另外两个函数从中继承。

不继承，但是，将公共代码放在第三个函数中，从其他两个函数调用。非常粗略：

function mvcOnFailure(message) {

    doTheCommonStuff("MVC Error", message /*, other, stuff */);
}

function ajaxOnFailure(ajaxContext) {

    doTheCommonStuff("Ajax Error", ajaxContext.responseText /*, other, stuff */);
}

function doTheCommonStuff(title, content /*, other, stuff */) {
    $.modal({
        title: title,
        closeButton: true,
        content: content
        ...
    });
}

Answer 2

您可以对两个回调使用相同的功能。您所要做的就是检查您的参数，例如在这种情况下，我会尝试查看它是一个对象还是一个字符串（不熟悉MVC，但我认为它将是一个对象）。

然而，这可能是棘手的（甚至是不可能的）并且它可以被认为是错误的编码（实质上是通过控制变量选择要执行的代码），因此保持函数但调用泛型函数来格式化/创建输出可能是更好的解决方案。

Answer 3

我认为message参数是不同的。因此，应该可以将两个函数合二为一：

function mvcOrAjaxOnFailure(message) {
    $.modal({
        title: message.responseText ? "Ajax (XHR) Error" : "MVC Error",
        closeButton: true,
        content: message.responseText || message,
        ...
    });
}

Answer 4

在ES5中，您不仅可以使用bind创建具有不同上下文对象的新函数，还可以执行currying（http://en.wikipedia.org/wiki/Currying）：

function displayModal(title, message) {
    $.modal({
        title: title,
        closeButton: true,
        content: message,
        ...
    });
}

var mvcOnFailure = displayModal.bind(undefined, "MVC Error");
var ajaxOnFailure = displayModal.bind(undefined, "Ajax Error");

现在你有两个新的displayModal函数，其中第一个参数（title）已经设置好了。所以，例如，当你打电话：

mvcOnFailure("foo");

“foo”将是message参数，title会自动“MVC错误”。

如何将两个函数的代码与不同的参数组合在一起？

4 个答案: