Возвращать значение из асинхронного метода JavaScript? - PullRequest
9 голосов
/ 02 июня 2011

Я столкнулся с проблемой, когда не могу получить значение из асинхронного метода JavaScript, который я использую в Jquery. Мой 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' равно 'undefined', предположительно, потому что назначение выполняется до завершения функции. Я не совсем уверен, как это сделать. Есть ли способ, которым я могу вернуть это значение из этой функции ??

Ответы [ 2 ]

23 голосов
/ 02 июня 2011

Лучше всего передать обратный вызов на 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);
}

Этот вид chicanery довольно стандартен для асинхронных вызовов (в частности, AJAX). Вы можете подключить некоторый хрупкий беспорядок таймеров в попытке синхронно применить силу, но борьба с естественным стилем API - это проигранная битва.

0 голосов
/ 02 июня 2011

Это проблема с обратными вызовами. «Ответ» произойдет позже, в другой момент, а не во время оценки метода. Небольшая польза от возврата сюда.

Ваш обратный вызов должен обрабатывать возвращаемое значение, что делает код более сложным:

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