我该如何利用回调函数异步XMLHtt prequest? [英] How can I take advantage of callback functions for asynchronous XMLHttpRequest?

查看:139
本文介绍了我该如何利用回调函数异步XMLHtt prequest?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我目前正在写JavaScript和有关的回调的混乱。我发现它不是一种内置功能,但...结果
现在我在读O'Relly JavaScript的第5版,它显示了一个示例code类似如下:

I'm currently writing JavaScript and confusing about callback. I've found it's not kind of built-in functions though...
I'm now reading O'Relly JavaScript 5th Edition and it shows a sample code something like below:

getText = function(url, callback) // How can I use this callback?
{
    var request = new XMLHttpRequest();
    request.onreadystatechange = function()
    {
        if (request.readyState == 4 && request.status == 200)
        {
            callback(request.responseText); // Another callback here
        }
    }
    request.open('GET', url);
    request.send();
}

基本上,我想我不明白回调的总体思路虽然...有人能写一个样本code趁<$ C的$ C>回调?

Basically, I suppose I don't understand the general idea of callback though... Could someone write a sample code to take advantage of callback above?

推荐答案

回调是pretty简单,漂亮!由于AJAX的本质要求,你的的脚本,直到你的请求块执行结束(这将是同步的话)。回调仅仅是指定处理响应一旦它回到你的方法的方法。

Callbacks are pretty simple and nifty! Because of the nature of AJAX calls, you don't block execution of your script till your request is over (it would be synchronous then). A callback is simply a method designated to handle the response once it gets back to your method.

由于JavaScript方法都是一流的对象,你可以通过他们周围像变量。

Since javascript methods are first class objects, you can pass them around like variables.

所以,在你的榜样

getText = function(url, callback) // How can I use this callback?
{
    var request = new XMLHttpRequest();
    request.onreadystatechange = function()
    {
        if (request.readyState == 4 && request.status == 200)
        {
            callback(request.responseText); // Another callback here
        }
    }; 
    request.open('GET', url);
    request.send();
}

function mycallback(data) {
   alert(data);
}

getText('somephpfile.php', mycallback); //passing mycallback as a method

如果你做到以上,就意味着你通过 myCallBack函数作为处理你的回应(回调)的方法。

If you do the above, it means you pass mycallback as a method that handles your response (callback).

修改

虽然这里的例子并没有说明回调的正常利益(你可以简单地把警报在函数的onreadystatechange毕竟!),重实用性肯定是一个因素。

While the example here doesn't illustrate the proper benefit of a callback (you could simply put the alert in the onReadyStateChange function after all!), re usability is certainly a factor.

您必须记住,这里最重要的是,JS方法都是一流的对象。这意味着,你可以通过他们周围像对象,并将它们连接到各种事件。当事件会触发,连接到这些事件的方法被调用。

You have to keep in mind that the important thing here is that JS methods are first class objects. This means that you can pass them around like objects and attach them to all sorts of events. When events trigger, the methods attached to those events are called.

当你做 request.onreadystatechange =功能(){} 你只是分配给被调用时,相应的事件触发该方法。

When you do request.onreadystatechange = function(){} you're just assigning that method to be called when the appropriate event fires.

所以这里的很酷的事情是,这些方法可以重复使用。假设你有一个弹出一个警告并填充在HTML页面中的某些字段404的Ajax请求的情况下,错误处理方法。

So the cool thing here is that these methods can be reused. Say you have an error handling method that pops up an alert and populates some fields in the HTML page in the case of a 404 in the AJAX request.

如果您不能分配回调或传递方法作为参数,你不得不一遍又一遍写错误处理code,而是你所要做的仅仅是将其指定为回调和所有错误处理将一次性进行排序。

If you couldn't assign callbacks or pass methods as parameters, you'd have to write the error handling code over and over again, but instead all you have to do is just assign it as a callback and all your error handling will be sorted in one go.

这篇关于我该如何利用回调函数异步XMLHtt prequest?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆