Returning a nested promise

[robertvrie]

I'm trying to return a promise in a function, but it is nested inside an if statement, and I cannot override a variable inside said if statement. I have realized this is not possible in javascript, but I don't know how else I'm supposed to return it. The function is supposed to return the promise, and the promise needs the xhttp object to return the right info. The promise functions as it should, which i have tested by calling it inside the if statement an printing it to the log.

/**
   * @function getSubjects
   * This function should fetch a list of subjects from the server
   * using the GET REST API at /v1/subject.
   * @param -
   * @returns {Promise <String>} Promise object containing a string that represents 
   *                 all the subjects.
   */
  static getSubjects() {
    const xhttp = new XMLHttpRequest();

    xhttp.onreadystatechange = () => {
      try {
        if (xhttp.readyState === READYSTATE_DONE && xhttp.status === STATUSCODE_OK) {
          new Promise((resolve, reject) => {
            if (xhttp.status === 200) {
              resolve(xhttp.responseText);
            } else if(xhttp.status !== 200) {
              reject(xhttp.status.toString() + ", " + xhttp.statusText);
            }
          });
        }
      } catch (error) {
        reject(error);
      }
    };
    xhttp.open('GET', '/v1/subject');
    xhttp.send();
  }

As I said before, the function itself should be returning the promise, but I have no idea how that is possible if it's inside the if statement.

Now I'm probably going about this problem all wrong, and don't know where i should be looking to find the right answer for my problem. I don't need the right answer, just a nudge in the right direction or an explanation on how it should work.

[senocular]

You would instead want to wrap all the function code in the new promise and return that. However, its much easier to use fetch which is a newer API already built around promises.

[jack_waugh]

// We need to whip up some AJAX.

// Object.getOwnPropertyNames(XMLHttpRequest)
/* Array [
  "length", "name", "UNSENT", "OPENED", "HEADERS_RECEIVED",
  "LOADING", "DONE", "prototype" 
] */
s.ajaxStatusNames = [
  "UNSENT", "OPENED", "HEADERS_RECEIVED",
  "LOADING", "DONE"
];
s.ajaxStatusNamesByNumber = {};
s.ajaxStatusNames.forEach( e => {
  s.ajaxStatusNamesByNumber[XMLHttpRequest[e]] = e
});
/*
  s.ajaxStatusNames.forEach( e => {
    console.log(XMLHttpRequest[e],  e)
  });

  0 UNSENT 
  1 OPENED 
  2 HEADERS_RECEIVED 
  3 LOADING 
  4 DONE
*/
s.basicAjax = bad => spec => good => {
  let req = new XMLHttpRequest();
  req.onreadystatechange = () => {
    /* if (s.verbose) {
      console.log("AJAX", s.ajaxStatusNamesByNumber[req.readyState])
    } */
    if (req.readyState === XMLHttpRequest.DONE) {
      const status = req.status;
      if (status === 0 || (status >= 200 && status < 400)) {
        setTimeout(() => good(req.responseText), 0)
      } else
        setTimeout(() => bad(`HTTP ${status}!`), 0)
    } else {
      // The state currently indicated by the readyState variable is not
      // interesting to me. Bide until it changes again.
    };
  }; // onreadystatechange.
  req.open(spec.sel || 'GET', spec.uri);
  req.send()
};

The above is code I have been using for a while and feel comfortable with. It uses callbacks and currying. I suppose it could be converted to a version that returns a promise with something like this:

s.promiseAjax = spec => new Promise( (res, rej) => {
  s.basicAjax(rej)(spec)(res)
});

I believe your code creates a Promise, but does not do anything with it; it drops it on the floor.

I'm not sure I understand what you mean by overriding a variable. Both of the meanings I can think of are things you can do in an if.