Обещание JavaScript не выполняется тогда

Я пытаюсь реализовать обещание в следующем коде JavaScript, однако функция process.then по какой-то причине никогда не выполняется. Кто-нибудь может понять, почему? Я настроил новое обещание, и оно выполняется, поскольку я тестировал его с помощью журнала консоли, однако оно никогда не выполняет функцию .then.

Спасибо

function connect() {
    'use strict';
    //User Input
    var query = document.getElementById('query').value;
    //API key & URL
    var apiUrl = 'https://community-wikipedia.p.mashape.com/api.php?action=opensearch&search=' + query + '&limit=20&namespace=0&format=json';
    var apiKey = "xxxxx";


    //While requesting the data from API set the innerHTML to loading.
    //document.getElementById('suggestions').innerHTML='Loading your request...';
    document.getElementById('spin').style.display = 'inline';

    //Process the JSON data
    var process = new Promise(function (resolve, reject) {
        //Method for connecting to API
        var httpRequest = new XMLHttpRequest();

        //Opening the API URL
        httpRequest.open('GET', apiUrl, true);
        httpRequest.setRequestHeader("X-Mashape-Key", apiKey);
        httpRequest.send(null);
        //When state has changed then triggers processResponse function
        httpRequest.onload = function() {
            //Checks the response codes
            if (httpRequest.readyState === 4) {
                //document.getElementById('suggestions').innerHTML='';
                if (httpRequest.status === 200) {
                    var response = JSON.parse(httpRequest.responseText);
                    //Clear any previous results
                    document.getElementById('suggestions').innerHTML = '';
                    //Remove spinner when data is input
                    document.getElementById('spin').style.display = 'none';
                    resolve(response);
                } else {
                    alert('There was a problem with the request');
                    reject('No Good!');
                }
            }
        }
        process.then (function(response) {
            //Set response to response
            var response = response;
            //Grab suggestions div from DOM   
            var suggestions = document.getElementById('suggestions');
            //Create new element UL
            var list = document.createElement('UL');
            //Create new elements for li's
            var newLi, newText;
            //For all the text nodes
            var textNodes = [];
            //For all the li's
            var liList = [];
            //For all the links
            var links = [];
            //For loop to add and append all suggestions 
            for (var i = 0; i < response[1].length; i++) {
                //Replace spaces with underscore
                var setHTML = response[1][i].replace(/\s/g, '_');
                //Creates the appropriate link
                var link = 'http://en.wikipedia.org/wiki/'+setHTML;
                //Create new a elements in array
                links[i] = document.createElement('a');
                //Adds the link to links array
                links[i].href = link;
                //Create new text node with the response from api
                textNodes[i] = document.createTextNode(response[1][i]);
                //Create a new element 'li' into array
                liList[i] = document.createElement('li')
                //Append the response(textnode) to the a in the array
                links[i].appendChild(textNodes[i]);
                //Append the a to the li in the array
                liList[i].appendChild(links[i]); 
                //Append the li to the UL 
                list.appendChild(liList[i]);
            }
            //Append the UL to the suggestions DIV
            suggestions.appendChild(list);
        }  
    )}
)}



function init() {
    'use strict';
    document.getElementById("query").addEventListener("keyup", connect);
}
window.onload = init;

person Adam91Holt    schedule 04.11.2014    source источник


Ответы (1)


Вы не должны помещать process.then() в блок new Promise().

Вместо:

var process = new Promise(function (resolve, reject) {
    // Code
    process.then (function(response) {
       // Code
    }  
)}

Использовать:

var process = new Promise(function (resolve, reject) {
    // Code
)}
process.then (function(response) {
    // Code
}

Вместо того, чтобы пытаться получить доступ к переменной process в области обещания, это правильно устанавливает then для вашего обещания процесса.

Кроме того, var response = response; довольно бессмысленно. Это ничего не добавляет к вашему коду.

person Cerbrus    schedule 04.11.2014
comment
Отлично работает, спасибо :) И я понимаю, что var response = response я просто вставил его туда на случай, если он не правильно его подберет. Но теперь я вижу, что нет смысла! - person Adam91Holt; 04.11.2014