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

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

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

1. вернуть данные из функции xhr.onreadystatechange в приватную функцию getData
2. вернуть данные из функции getData в общедоступную функцию getCars (или вызвать функцию getCars, возвращающую значение)

Я заставил его работать с синхронным режимом 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]}
            })
        }

    }
})();