javascript - 如何将参数传递给回调而不访问 Javascript 中的母函数

Question

在 Javascript 中，我有来自外部库的以下函数:

getParentTabId(callback);

在代码的其他部分，它的用法如下:

var openTab = function(result){
  var parentId = result.Id;
  //opentNewTab is another external function
  openNewTab(parentId, 'https://www.google.com');
}

function handleOnClick(){
  getParentTabId(openTab);
}

这正在起作用。我的目的是将变量传递给 openNewTab 作为第二个参数，而不是使用固定值，例如 ' https://www.google.com '，如下:

var openTab = function(result, url){
  var parentId = result.Id;
  //opentNewTab is another external function
  openNewTab(parentId, url);
}

我尝试了以下方法:

function handleOnClick(){
  var url = 'http://stackoverflow.com';
  getParentTabId(function(result){
    openTab(url, result);
  });
}

但它不起作用，因为回调无法看到 url 变量。考虑到我无法修改 getParentTabId 函数，您将如何解决这个问题？

Answer 1

您可以尝试声明一个函数 getOpenTab，它返回一个带有动态 url 的 openTab 函数:

function getOpenTab(url) {
  return function(result) {
    var parentId = result.Id;
    //opentNewTab is another external function
    openNewTab(parentId, url);
  }
}

function handleOnClick() {
  getParentTabId(getOpenTab('www.foo.com'));
}

说明:您正确地指出回调不会“看到”url 参数，因为在 getParentTabId 的实现中，回调被称为 callback(result)。这就是为什么必须动态创建回调函数的原因。

现在，如何创建具有动态内容的函数？很简单，只需创建另一个函数来返回带有所需动态参数的回调函数。

有了匿名函数，整个事情就变成了:

function handleOnClick() {
  var url = 'www.foo.com';
  getParentTabId(function(result) {
    var parentId = result.Id;
    openNewTab(parentId, url);
  });
}