从异步 JavaScript 方法返回值?

Posted

技术标签:

【中文标题】从异步 JavaScript 方法返回值?【英文标题】:Returning value from asynchronous JavaScript method? 【发布时间】:2011-09-06 20:23:45 【问题描述】:

我遇到了一个问题,我似乎无法从我在 Jquery 中运行的异步 javascript 方法获取值。我的 Jquery 看起来像这样:

$(document).ready( function() 
$('#splash_image_upload').change( function() 
    var file = this.files[0];
    var blob_string = create_blob(file);
    alert(blob_string);
 );

我能够访问来自“onload”事件的值,但我似乎无法返回实际值。我试过这个:`

function create_blob(file) 
    var reader = new FileReader();
    reader.onload = (function()  return function(e)  return e.target.result; ; )();
    reader.readAsDataURL(file);

每次我执行这个函数时,“blob_str”变量的值都是“未定义”,大概是因为赋值是在函数完成之前完成的。我真的不知道该怎么做。有没有办法可以从这个函数返回这个值?

【问题讨论】:

相关:How to return the response from an AJAX call from a function? 【参考方案1】:

最好的办法是将回调传递给create_blob,让回调做任何需要做的事情,如下所示:

create_blob(file, function(blob_string)  alert(blob_string) );

function create_blob(file, callback) 
    var reader = new FileReader();
    reader.onload = function()  callback(reader.result) ;
    reader.readAsDataURL(file);

这种诡计对于异步调用(尤其是 AJAX)来说是相当标准的。您可以连接一些脆弱的计时器以尝试同步强制,但与 API 的自然风格作斗争是一场失败的战斗。

【讨论】:

哇,谢谢。我从来没想过。我只是认为你可以只返回 onload() 函数中的值,但是函数又是异步的,所以它在函数完成之前返回!非常感谢!【参考方案2】:

这是回调的问题。 “答案”将在稍后发生,而不是在评估方法期间。在这里退货没什么用。

您的回调需要处理返回值,使代码看起来更复杂:

reader.onload = function(e)  
  // handle here the result
  // do something with e.target.result
;

【讨论】:

以上是关于从异步 JavaScript 方法返回值?的主要内容,如果未能解决你的问题,请参考以下文章

将数据从 Java/JSF2 bean 传递到 Javascript/jQuery 组件作为返回值的最佳方法

javascript生成器

Javascript-异步等待并获取-返回值,而不是诺言?

如何从 Haneke 的异步 fetch 方法返回值

获取JavaScript异步函数的返回值

ionic3 异步请求中.then的作用,以及如何理解JavaScript Promise