javascript - 将参数传递给 Window[callback] 函数

Question

我有一些代码可以从 API 请求一些 JSON。当返回数据时，根据文档，它会发回一个回调函数，用于在顶层解析数据。调用后，我有以下代码来捕获数据并进行处理:

var callback = 'functionUsedInApiCall';
window[callback] = newCallBackFunction;

在返回数据时，我如何将自定义参数传递给上面的回调函数？

为了抓取数据，我必须这样写回调函数:

function newCallBackFunction(root) {
   //root is the data
}

如有任何帮助，我们将不胜感激。

Answer 1

你是说 JSONP ？如果是这样，您根本不调用回调或传入参数，API 返回的代码会调用。

例如，您的代码:

window.myCallback = newCallbackFunction;

function newCallbackFunction(data) {
    // use the data
}

(我假设这不在全局范围内，因此分配给 window 对象。)

...加上您用于启动 JSONP 调用的代码，这通常是将一个 script 元素附加到您的页面，其中包含一个包含回调名称(上面的“myCallback”)的 URL。

他们的回应将是这样的:

myCallback({
    // data here
});

...当它到达时，它将运行(因为它是 script 元素的内容)，并将调用您的函数。这就是 JSONP 的工作原理。

---

如果你想为函数包含更多参数，你所做的就是让他们调用的回调转过来并调用你的目标函数，例如:

window.myCallback = function(data) {
    newCallbackFunction(data, "foo", "bar");
};

function newCallbackFunction(data) {
    // use the data
}

现在，当他们的代码调用全局 myCallback 时，它所做的就是转身并使用该数据和您指定的参数调用 newCallbackFunction .

这些参数不必像上面那样是文字。这是一个具有更多上下文的示例，使用 closure :

// Assume the url already contains the name of the callback "myCallback"
function doJSONP(url, niftyInfo, moreNiftyInfo) {
     var script;

     // Set up the callback
     window.myCallback = function(data) {
        // Runs when the data arrives
        newCallbackFunction(data, niftyInfo, moreNiftyInfo);
     };

     // Trigger the request
     script = document.createElement('script');
     script.src = url;
     document.documentElement.appendChild(script);
}

不过，理想情况下，在执行 JSONP 时，您每次都会自动生成回调的名称，以便它特定于请求(以防您同时有两个未完成的请求):

// Assume the url ends with "callback=" and we append the name of the
// callback function to it
function doJSONP(url, niftyInfo, moreNiftyInfo) {
     var cbname, script;

     // Get a callback name
     cbname = "callback_" +
              new Date().getTime() +
              "_" +
              Math.floor(Math.random() * 10000);

     // Set up the callback
     window[cbname] = function(data) {
        // Remove us from the window object
        try {
            delete window[cbname];
        }
        catch (e) { // Handle IE bug (throws an error when you try to delete window properties)
            window[cbname] = undefined;
        }

        // Runs the function
        newCallbackFunction(data, niftyInfo, moreNiftyInfo);
     };

     // Trigger the request
     script = document.createElement('script');
     script.src = url + encodeURIComponent(cbname);
     document.documentElement.appendChild(script);
}