Javascript $.get()函数的执行时间

javascript $.get() function execute time

本文关键字：函数 执行时间 get Javascript      更新时间：2023-09-26

下面是我的演示代码:

doGet('../loaderDemo/1.lst');
doGet('../loaderDemo/2.lst');
doGet('../loaderDemo/3.lst');
doGet('../loaderDemo/4.lst');
doGet('../loaderDemo/5.lst');
function doGet(filename) {
    $.get(filename,function (data) {
        console.log(data + filename);
    });
}

行"console.log(…)"可能不会按照doGet()的顺序执行，输出内容是而不是作为1的顺序。LST -> 2。LST -> 3。LST -> 4。LST -> 5.lst。

实际上每次执行的输出顺序都是随机的。

我怎么能让它按顺序输出?

谢谢你的帮助:-)

------------- 更新 -------------------

"。"lst"文件是我想加载的3D模型。我只是想按顺序加载模型，这样我就可以正确地渲染动画。那么在这种情况下哪个是最好的解决方案呢?

每个"

。"Lst"文件包含一个帧的信息。在这个演示中，"console.log()"的输出必须按1的顺序排列。LST -> 2。LST -> 3。LST -> 4。LST -> 5。

jQuery $.get返回一个Promise(各种类型)

因此，只需最少的重写，您就可以执行如下操作

doGet('../loaderDemo/1.lst')
.then(function() {
    doGet('../loaderDemo/2.lst');
})
.then(function() {
    doGet('../loaderDemo/3.lst');
})
.then(function() {
    doGet('../loaderDemo/4.lst');
})
.then(function() {
    doGet('../loaderDemo/5.lst');
});
function doGet(filename) {
    // added return
    return $.get(filename,function (data) {
        console.log(data + filename);
    });
}

但是，如果下载完成的顺序并不重要，而"处理"的顺序很重要，则可以使用jQuery.when"等待"所有下载完成，然后按照所需的顺序处理结果

$.when(doGet('../loaderDemo/1.lst'),
    doGet('../loaderDemo/2.lst'),
    doGet('../loaderDemo/3.lst'),
    doGet('../loaderDemo/4.lst'),
    doGet('../loaderDemo/5.lst')
)
.done(function(v1, v2, v3, v4, v5) {
    [].forEach.call(arguments, function(arg) {}
        console.log(arg.data, arg.filename);
    })
});
function doGet(filename) {
    return $.get(filename)
    .then(function(data) {
        // need this so we can access the filename and the data for each result
        return {
            data: data,
            filename: filename
        };
    });
}

欢迎来到异步编程的世界。处理此问题的最佳方法是同时调用所有5个asynch函数，但延迟执行控制台日志语句，直到它们全部完成，然后按顺序运行它们。

(当然，这是假设始终以相同的顺序运行它们非常重要。一个更好的解决方案可能是重构你的代码，这样哪一个先完成并不重要)

这里有一个关于你的问题的例子。

大多数情况下，这比任何顺序解决方案都快得多，因为它将同时运行5个调用，而不是一个接一个地运行5个调用。

return $.when(
    doGet('../loaderDemo/1.lst'),
    doGet('../loaderDemo/2.lst'),
    doGet('../loaderDemo/3.lst'),
    doGet('../loaderDemo/4.lst'),
    doGet('../loaderDemo/5.lst'),
).done( function(res1, res2, res3, res4, res5 ) {
  console.log(res1),
  console.log(res2),
  console.log(res3),
  console.log(res4),
  console.log(res5),
});

(我以前的编辑使用$q，但事实证明，jquery有一个内置的东西，工作原理几乎相同)

相关文章：