从回调函数返回答案

【问题标题】：Returning from a callback function从回调函数返回
【发布时间】：2014-08-15 17:48:44
【问题描述】：

我正在为 Webkit Storage API（this API 的新版本）编写一个基本的包装器供我使用。我目前的问题是queryUsageAndQuota() 函数。

我对那个特定函数的包装最初看起来像这样：

self.pers.getQuota = function() {
    self.pers.queryUsageAndQuota(function(usage,quota) {
        return quota;
    });
}
// self is a reference to the top level of this 'wrapper'

因此，我会致电 var quota = self.pers.getQuota(); 并返回配额。

失败后，我查看了this question 并对其进行了更改，因此我使用了用户定义的回调。现在函数是这样的：

self.pers.getQuota = function(callback) {
    self.pers.queryUsageAndQuota(function(usage,quota) {
        callback.call(quota);
    });
}

但是，执行这一行：

self.pers.getQuota(function(quota) {
    console.log(quota);
});

在日志中显示undefined。我不知道为什么，因为当我执行底层函数navigator.webkitPersistentStorage.queryUsageAndQuota() 时，我得到了正确的数字。

【问题讨论】：

quota 是一个数组吗？因为如果是的话，使用 call 是有意义的。但如果不是，只需调用callback 作为正常功能。

标签： javascript storage

【解决方案1】：

.call 不像你想象的那样工作。而是使用callback.call(null, quota)。

Function.prototype.call（apply 也是如此）的实际签名是

 Function.prototype.call(valueOfThis, valueOfParam1, valueOfParam2, ...);

这也是为什么我经常说javascript中的this关键字很愚蠢，你应该避免使用它。它只是像所有其他参数一样的另一个参数，您只是无法为其指定名称。当 Netscape 要求这种基于 Scheme 的语言看起来像 Java 时，这是 javascript 创建的遗迹。

顺便说一句，您可以在这里使用第三种调用方法。简单的

callback(quota);

然而，这有一个副作用，就是让 javascript 猜测你想要的 this 是什么（在这种情况下是全局 window 对象）。只要你不使用this，简单的语法就很好用。

如果您真的真的想要返回一个值而不是传递一个回调，请查看 javascript 承诺。在不知道您所处的环境以及您使用的库的情况下，我无法告诉您使用哪一个，但jQuery has a good implementation in the Deferred object

【讨论】：

如果有帮助的话，就完成原版。没有库，使用所描述的 API，Chrome，Windows 7。
最新的 chrome supports promises 如果这就是您唯一需要担心的浏览器的话。事实上，除了 IE 之外，最新的一切似乎都支持它们。

【解决方案2】：

试试

self.pers.getQuota = function(callback) {
    self.pers.queryUsageAndQuota(function(usage,quota) {
        callback(quota);
    });
}

或者

self.pers.getQuota = function(callback) {
    self.pers.queryUsageAndQuota(function(usage,quota) {
        callback.call(/* an object as 'this'*/, quota);
    });
}

Function.prototype.call()

或者

self.pers.getQuota = function(callback) {
    self.pers.queryUsageAndQuota(function(usage,quota) {
        callback.apply(/* an object as 'this'*/, [quota]);
    });
}

Function.prototype.apply()

【讨论】：