Как вернуть результат из callback в функцию [дубликат]

#javascript

        
             
                
                    
                        
                            На этот вопрос уже даны ответы здесь:
                            
                        
                    
                
                        
                            Как вернуть значение из события или из функции обратного
вызова? Или хотя бы дождаться их окончания
                                
                                    (3 ответа)
                                
                        
                                Закрыт 3 года назад.
            
                    
Столкнулся с проблемой асинхронного выполнения запросов. Подскажите, как правильно
написать код:



// Determine the only image extension on the url
function getImgType(objUrl) {
	var res = null;
	chrome.downloads.search({url: objUrl}, function(items) {
		var mime = items[0].mime;
		if (mime.indexOf('image/') == 0) {
			res = mime.substring(6);
			console.log('1- res = ' + res);
		};
	});
	console.log('2- res = ' + res);
	return res;
};




Результат работы:


  2- res = null
  1- res = jpeg


Нужно чтобы getImgType вернула результат только после завершения работы callback
в функции function(items).
    

Ответы

Ответ 1

Результат работы правильный, у вас скрипт выполняется в однопоточной среде, поэтому
вы сначала увидели результат переменной res равной null, затем сработал асинхронный
callback переданный в функцию search и переменной res присвоилось заначение jpeg. Правильно
будет передавать callback в функцию getImgType или использовать Promise

function getImgType(objUrl, callback) {
    chrome.downloads.search({url: objUrl}, function(items) {
        var mime = items[0].mime;
        if (mime.indexOf('image/') == 0) {
            callback(mime.substring(6));
        };
    });
};


И собственно вызов

getImgType("http://some-url/", function(mimeType){
   // какие-то операции с mimeType
});


C использованием Promise 

function getImgType(objUrl){
    return new Promise(function(resolve, reject){
         chrome.downloads.search({url: objUrl}, function(items) {
             var mime = items[0].mime;
             if (mime.indexOf('image/') == 0) {
                 resolve(mime.substring(6));
             } else {
                 reject(new Error("Incorrect mime type")
             }
         });
    });
}


Вызов функции getImgType будет выглядеть теперь иначе 

getImgType("http://some-url/")
      .then(function(mimeType){
          // какие-то операции с mimeType
      })
      .catch(function(err){
          // обработка ошибки 
      });


Ответ 2

Чтобы получить вызов типа mimeType = getImgType("http://some-url/") необходимо использовать
синхронный запрос, чего делать крайне не рекомендуется. Однако, если по-другому решить
поставленную задачу не удается, то для коротеньких запросов заголовка страниц можно
использовать следующий код:

function getImgType(objUrl) {
  var xhr = new XMLHttpRequest();
  xhr.open('HEAD', objUrl, false);
  try {
    xhr.send();
  } catch(err) {
      return;
    };
  var imgType = xhr.getResponseHeader("Content-Type");
  if (imgType) {
    if (imgType.indexOf('image/') == 0) {
      return imgType.substring(6);
    };
  };
};


И собственно вызов:

mimeType = getImgType("http://some-url/");