Javascript не возвращает содержимое сохраненного файла JSON - PullRequest
Новая
       7

Javascript не возвращает содержимое сохраненного файла JSON

0 голосов
/ 25 октября 2019

Я работаю над небольшим сценарием, который должен брать информацию из файла JSON и использовать эту информацию для заполнения таблицы на моей веб-странице. Я пишу сценарий из учебника Youtube здесь , ниже приведен код, который я дал в учебнике: 

<script type="text/javascript">
        const rankingsBody = document.querySelector("#rankings-table > tbody");

        function loadRankings() {
            const request = new XMLHttpRequest();

            request.open("get", "data/rankings.json");

            request.onload = () => {
                try {
                    const json = JSON.parse(request.responseText);
                    populateRankings(json);
                } catch (e) {
                    console.warn("Could not load rankings");
                }
            };

            request.send();
        }


        function populateRankings (json) {
            console.log(json);
        }

        console.log(request);
    </script>

Теперь, функция console.log () в концесценария должен печатать содержимое файла JSON на консоль, после проверки в Firefox он не печатает и выдает следующую ошибку:

ReferenceError: запрос не определен

И когда я пытаюсь запустить функцию loadRankings в консоли, она говорит, что она не определена, поэтому я предполагаю, что она не возвращает данные, как ожидалось, потому что они не были определены?

Я не совсем уверен, в чем может быть проблема, не могли бы вы помочь мне разобраться с этим? Заранее спасибо, ребята.

1 Ответ

1 голос
/ 26 октября 2019

Вы объявили request в loadRankings(). Затем вы попытались распечатать его вне контекста, в котором он существует, с console.log(request); объявления const не поднимаются , поэтому вы получаете ошибку ссылки. Либо переместите объявление в глобальную область, например, так, чтобы оно было видно для вашего оператора console.log (): 

    const rankingsBody = document.querySelector("#rankings-table > tbody");
    let globalRequest;

    function loadRankings() {

        const request = new XMLHttpRequest();
        // Expose the most recent request in the global variable
        globalRequest = request;

        request.open("get", "data/rankings.json");

        request.onload = () => {
            try {
                const json = JSON.parse(request.responseText);
                populateRankings(json);
            } catch (e) {
                console.warn("Could not load rankings");
            }
        };

        request.send();
    }


    function populateRankings (json) {
        console.log(json);
    }

    console.log(globalRequest);

, либо просто полностью удалите оператор console.log ().

...