如何在不立即运行的情况下将参数传递给函数？

Question

我在试图拼凑一个有点动态的Google地图显示时遇到了一些奇怪的问题。点击时，我在地图上覆盖了一个我想调用的函数。最初，我拥有了一切硬编码，所以我不得不为每个叠加这样的功能：

google.maps.event.addListener(southEast, 'click', showSouth); 
function showSouth() { 
    // do stuff 
} 

这个工作没有问题，但后来我做了整个页面更动态的，所以我决定做一个函数，将通过一个ID然后根据这个显示，这就是我原本应该设置的。我改变了代码，看上去就像这样：

google.maps.event.addListener(southEast, 'click', showArea(1)); 
function showArea(id) { 
    // do stuff based on that id 
} 

功能工作，但问题是，它立即调用页面加载。经过研究，我了解到，当您使用圆括号调用函数时，该函数将立即调用，然后返回值被引用。 source

因此，现在我有点卡住了如何将该ID传递给函数而不立即调用该函数。我发现一些这样做的hacky方式可能工作，但我觉得这不应该是我必须一起破解的东西...

Answer 1

有showArea返回一个函数，与id一起工作。

function showArea(id) { 
    return function() { 
     // do stuff with id 
    }; 
} 

返回的函数关闭超过id因此它继续引用它，并且被传递到addListener用作该处理程序。

---

或者，你可以只内嵌调用showArea(1)功能...

google.maps.event.addListener(southEast, 'click', function() { showArea(1); }); 
function showArea(id) { 
    // do stuff based on that id 
} 

这工作，因为你硬编码1。如果它是一个可以改变的变量，就像在一个循环中一样，你会使用第一个例子。