Возвращаемые данные, разрешенные XMLHttpRequest с функцией шаблона модуля

Question

У меня проблема с объединением обратных вызовов javascript и отображением шаблона модуля. Что я пытаюсь сделать, так это вернуть текст ответа HTTP с помощью метода функции carsData.getCars().

В основном то, что я хочу сделать, это:

1. возврата данных из xhr.onreadystatechange функции частному getData функции
2. возврата данных из getData функции в общественной getCars функции (или вызовите функцию getCars возвращения a)

Я получил его для работы с синхронным режимом AJAX, но я знаю, что это не лучшая практика в javascript развитие.

Я попытался заставить его работать с обратными вызовами, но с треском провалился. Возможно ли это сделать в javascript?

P.S. Я использую XMLHttpRequest в Vanilla JS вместо других фреймворков для обучения.

'use strict'; 
var carsData = (function() { 
    var carsElement = document.getElementById('carsListing'), 
     successHandler = function(data) { 
      carsElement.innerHTML = data.data; 
      //return data; 
     }, 
     dataWrapper = "", 
     getData = function(callback) { 
      var url = 'data/cars.json', 
       xhr = new XMLHttpRequest();  

      xhr.onreadystatechange = function() { 
       var status; 
       var data; 

       if (xhr.readyState == 4) { // `DONE` 
        status = xhr.status; 
        if (status == 200) { 
         data = JSON.parse(xhr.responseText); 
         successHandler && successHandler(data); 
         callback(data); 
         return data; 
        } 
       } 
      }; 
      xhr.open('get', url, false); // synchronous js 
      xhr.send(); 
      return xhr.onreadystatechange(); 
      //return 'xx'; 
     } 

    return { 
     getCars: function() { 
      return getData(function(data){ 
       console.log(data); // Object {data: Array[5]} 
      }) 
     } 

    } 
})(); 

Answer 1

Нет. Вы не можете этого сделать. Я понял, что вы обычно видите результаты, отправленные объекту DOM. Потому что они там ждут ответа. Ваш оператор возврата, как бы интуитивно понятный, как кажется (предполагается, что вы исходите из не-прототипных языков), уже будет запущен. Похоже, что это не так, но это из-за асинхронной природы, о которой вы знаете. Вы должны использовать Promises или вам нужно, чтобы ваш callback делал что-то с данными, которые «ожидают» данные обратного вызова, как вы делали с successdata.