Question

我有一个功能，可以监听屏幕上的点击并触发回调。它是Helper对象的一部分（这就是为什么在我的示例代码中以Helper一词为前提。但这无关紧要。

var Helper = { 
    bodyClickListener: function(fn) {
        var window = document.getElementsByTagName('body')[0];
        window.click();
        CORE.dom.on(window, 'click', function(event) {
            CORE.dom.off(window, 'click');
            fn(event);
        });
    }
}

我需要能够使用先前设置的参数将函数传递给此函数。

function someFunction() {    
    var popup = document.getElementById('tagResultsPopup');
    Helper.bodyClickListener(function(popup) {
        return function(event) {
            event.stopPropagation();
            removePopup(popup);
        };              
    }(document.getElementById('tagResultsPopup')));

    function removePopup(element) {
        if(element) {
            element.parentNode.removeChild(element);
        }
    };
}

上面的代码有效，但你会注意到我必须在回调函数中设置popup变量。它已经在上面设定。如何将对早期变量的引用传递给回调函数。

Answer 1

如果我理解你的问题，你不需要做太多。您可以使用外部定义的popup变量。

var popup = document.getElementById('tagResultsPopup');
Helper.bodyClickListener(function(event) {
    event.stopPropagation();
    //Don't set it  
    //var popup = document.getElementById('tagResultsPopup');
    removePopup(popup);//popup will refer to the correct variable
});

Answer 2

传递给bodyClickListener的函数是一个闭包。你可以简单地在该函数中引用'popup'而没有任何问题。您不必创建新变量。

Answer 3

答案是以这种方式使用闭包：

Helper.bodyClickListener(function(popup) {
    return function(event) {
        event.stopPropagation();
        removePopup(popup);
    };              
}(document.getElementById('tagResultsPopup')));

这样回调函数可以访问传递给参数函数的变量。所以在这里，返回实际上是我作为回调传递的函数。

将参数传递给回调函数

3 个答案: