Javascript函数性能

我正在学习javascript和json，但我写的每一行代码都是另一个问题。我已经编写了一个使用json的脚本，但我是一个初学者，我所写的脚本的性能并不是很好。只有当我使用firebug或其他工具一步一步地进行调试时，代码才会起作用，这使我认为代码（或其中的一部分…您将看到的创建表的代码）的执行需要太多时间，因此浏览器会停止它

我的代码是：

var arrayCarte = [];
var arrayEntita = [];
var arraycardbyuser = [];

function displayArrayCards() {
    var richiestaEntity = new XMLHttpRequest();

    richiestaEntity.onreadystatechange = function() {
        if(richiestaEntity.readyState == 4) {
            var objectentityjson = {};
            objectentityjson = JSON.parse(richiestaEntity.responseText);

            arrayEntita = objectentityjson.cards;
        }
    }
    richiestaEntity.open("GET", "danielericerca.json", true);
    richiestaEntity.send(null);

    for(i = 0; i < arrayEntita.length; i++) {

        var vanityurla = arrayEntita[i].vanity_urls[0] + ".json";
        var urlrichiesta = "http://m.airpim.com/public/vurl/";

        var richiestaCards = new XMLHttpRequest();
        richiestaCards.onreadystatechange = function() {
            if(richiestaCards.readyState == 4) {
                var objectcardjson = {};
                objectcardjson = JSON.parse(richiestaCards.responseText);


                for(j = 0; j < objectcardjson.cards.length; j++)
                arrayCarte[j] = objectcardjson.cards[j].__guid__; //vettore che contiene i guid delle card

                arraycardbyuser[i] = arrayCarte;

                arrayCarte = [];
            }
        }
        richiestaCards.open("GET", vanityurla, true);
        richiestaCards.send(null);
    }





    var wrapper = document.getElementById('contenitoro');

    wrapper.innerHTML = "";

    var userTable = document.createElement('table');

    for(u = 0; u < arrayEntita.length; u++) {
        var userTr = document.createElement('tr');

        var userTdcard = document.createElement('td');
        var userTdinfo = document.createElement('td');

        var br = document.createElement('br');

        for(c = 0; c < arraycardbyuser[u].length; c++) {
            var cardImg = document.createElement('img');
            cardImg.src = "http://www.airpim.com/png/public/card/" + arraycardbyuser[u][c] + "?width=292";
            cardImg.id = "immaginecard";
            userTdcard.appendChild(br);
            userTdcard.appendChild(cardImg);

        }

        var userdivNome = document.createElement('div');
        userdivNome.id = "diverso";
        userTdinfo.appendChild(userdivNome);

        var userdivVanity = document.createElement('div');
        userdivVanity.id = "diverso";
        userTdinfo.appendChild(userdivVanity);

        var nome = "Nome: ";
        var vanityurl = "Vanity Url: ";
        userdivNome.innerHTML = nome + arrayEntita[u].__title__;
        userdivVanity.innerHTML = vanityurl + arrayEntita[u].vanity_urls[0];

        userTr.appendChild(userTdcard);
        userTr.appendChild(userTdinfo);
        userTable.appendChild(userTr);
    }

    wrapper.appendChild(userTable);
}

var arrayCarte=[]；
var arrayEntita=[]；
var arraycardbyuser=[]；
函数displayArrayCards（）{
var richiestateentity=new XMLHttpRequest（）；
richiestaEntity.onreadystatechange=函数（）{
if（richiestatentity.readyState==4）{
var objectentityjson={}；
objectentityjson=JSON.parse（richiestateEntity.responseText）；
arrayEntita=objectentityjson.cards；
}
}
open（“GET”，“danielericerca.json”，true）；
richiestateentity.send（空）；
对于（i=0；i

---

如何解决这个问题？

您已经创建了一个竞争条件（某种程度上）-您不必等到解析了AJAX并将数据写入正确的变量之后，再继续执行页面逻辑的其余部分

当您在调试器中运行它时，在尝试使用

onstatechange

处理程序中填充的变量之前，您最终会给代码足够的时间来完成AJAX请求

使用jQuery和延迟对象，这段代码会容易得多：

var arrayCarte, arrayEntita, arraycardbyuser;

// do first seeding request
var req1 = $.ajax(...);

var req2 = [];
req1.done(function(objectentityjson) {

    arrayEntita = objectentityjson.cards;

    // initiate the inner AJAX requests
    for (var i = 0; i < arrayEntita.length; ++i) {

        var tmp = $.ajax(...);
        tmp.done(function(objectcardjson) {
            // process the sub data here
            ...
        });

        req2.push(tmp);  // keep the object around for later sync-up
    }
});

// this'll only fire when all of the inner AJAX requests have completed
$.when.apply($, req2).done(function() {
     // do the rest of your page setup here
     ...
});

var arrayCarte、arrayEntita、arraycardbyuser；
//第一次播种请求
var req1=$.ajax（…）；
var req2=[]；
请求1.完成（函数（objectentityjson）{
arrayEntita=objectentityjson.cards；
//启动内部AJAX请求
对于（变量i=0；i

使用jQuery可以简化很多工作。正确缩进代码也是如此。@GabrielButoeru是的，异步很好。但是你还需要完成第二个，然后才能做其他事情。没错，在异步请求完成之前，你不能创建表。只有在你只有一张卡的情况下。您有一个循环，这表明情况并非如此，因此在它们全部完成之前，您无法构建表。问题在于之后的代码（从

var wrapper=…

开始）-在AJAX请求完成之前，您没有什么可以阻止此代码运行。那么我如何修复它？抱歉，我是一个初学者（n00b）@GabrielButoeru考虑到您要发送多个AJAX请求，并且您显然需要在继续之前回答所有请求，我强烈推荐jQuery及其“延迟对象”功能。这些功能使得只有在一整套异步调用完成时才容易触发回调。我不明白如何处理回调（这是我学习javascript的第二周）：我现在正在看它是如何工作的，但遗憾的是，我不能理解我读到的很多内容。