+回调

Question

我有一个有关回调和超时的javascript问题。

这是我编写的一个示例代码片段：

var f1 = function(){
    var result;
    window.setTimeout(
        function(){
            console.log("timeout in 100ms");
            result = 10;
        }.bind(this), 100);
    return result;
};

因此，我希望函数修改变量结果。我使用.bind(这个)来确保它知道结果。

不过，运行f1()时的输出是9，而不是10，这正是我所希望的。

有什么线索吗？

Answer 1

结果是一个数字。因此，它作为值9返回，而不是对对象的引用。

bind在您的场景中没有任何有用的效果。bind更改函数上下文(this)。

返回包含值10的对象将有效。

var f1 = function(){
        var result = { value: 9 };
        window.setTimeout(
                          function(){
                            console.log("timeout in 100ms");
                            result.value = 10;}.bind(this), 100);
        return result;
};

你的问题可能有更好的解决方案。

回调：

var f1 = function(valueCallback){
        var result;
        window.setTimeout(function(){
            console.log("timeout in 100ms");

            result = 10;
            valueCallback(result);
};

这样一种功能的使用方式如下：

f1(function(value)) {
    console.log(value); // Will print 10 after 100ms. 
})

另一种选择，可以使用承诺：

var f1 = function() {
    return new Promise(function(resolve, reject) {
        window.setTimeout(resolve.bind(null, 10), 100);
    }
}

您可以这样调用这样的函数：

f1().then(function(value) {
   console.log(value); // Will print 10 after 100ms.
});

Answer 2

您正在调用超时值，以便在函数返回后修改该值，因此它返回结果的默认值，然后调用超时，而且由于该值的作用域仅限于该函数，因此您无法在修改后返回它。

你能做的就是

var result = 9;
var f1 = function(){

            window.setTimeout(
                              function(){
                                console.log("timeout in 100ms");
                                result = 10;}.bind(this), 100);
            return result;};

在调用f1之后，t将返回9，然后调用result，它将显示10