Question

我有一个包含回调的函数，当完成时，我想有选择地将其中继回原始函数调用。

例如：

const UI = {
    update : function(var1) {
        $(var1).animate({ opacity: 0 }, 100, "linear", function() {
                // Callback 1: Do stuff
        });
    }
}

我想要的是以下物品：

UI.update("whatever", function() {
   // Callback 2: Do more stuff after Callback 1 is complete
});

是否可以像这样进行内联？

Answer 1

是的，当然-只需为回调声明一个参数，然后如果动画完成后update不需要执行任何操作，只需将回调直接传递给animate即可：

const UI = {
    update : function(var1, callback) {
// -------------------------^
        $(var1).animate({ opacity: 0 }, 100, "linear", callback); // ***
    }
};

如果update需要在调用回调之前做更多工作，只需从animate回调内部调用回调：

const UI = {
    update : function(var1, callback) {
    // ---------------------^
        $(var1).animate({ opacity: 0 }, 100, "linear", function() {
            // ...work `update` does here...
            // Call the callback:
            if (callback) {                                           // ***
                callback(/*...perhaps some arguments here...*/);      // ***
            }                                                         // ***
        });
    }
}

对callback的调用直到update返回之后才是问题。 animate回调是var1和callback 上的 closure ¹²（更准确地说，是在词法环境中）它们存在于其中），因此它们在update返回后仍可访问。

您可能只对上面显示的“真实”检查感到满意。其他时候，人们会更加严格，例如：

if (typeof callback === "function") {

（许多年前，在网络浏览器中，某些主机提供的功能的"object"具有"function"而非typeof，但是所有模糊的现代浏览器都确保它是{{ 1}}。）

有关闭包的更多信息：

¹Closures are not complicated在我贫乏的小博客上（有些过时的术语，但是...）

²Canonical Stack Overflow question about closures

回调中的内联回调函数？

1 个答案: