Return return Promise Status: Pending

I am testing the fetch API with the jsonplaceholder url, but my function returns “Promise Status: Pending,” and I don’t understand why:

function getUsers(url) {
  return fetch(url)
}

const users = getUsers(`https://jsonplaceholder.typicode.com/users`);

users.then(response => {
  console.log(response.text());
});

I think the problem is with asynchronous / synchronous methods?

+7
source share
1 answer

  I think the problem is becoming an asynchronous / synchronous method?

Yes. You (mostly) used the original promise correctly fetch(), but text()also returns the promise. So:

users.then(response => response.text()) // 1
     .then(json => {                    // 2
          console.log(json);
     })
     .catch(error => {                  // 3
          // handle error
     });

fetch("https://jsonplaceholder.typicode.com/users")
.then(response => response.text())      // 1
     .then(json => {                    // 2
          log("typeof json: " + typeof json);
          log(json);
     })
     .catch(error => {                  // 3
          // handle error
     });

function log(msg) {
  var p = document.createElement("pre");
  p.appendChild(document.createTextNode(msg));
  document.body.appendChild(p);
}
Run codeHide result

fetch(), text().

text(), (, JSON).

fetch() text(), - .

, . , . , (, Node) .


JSON, json(), text(), :

users.then(response => response.json())
     .then(arrayOfUsers => {
          console.log(arrayOfUsers);
     })
     .catch(error => {
          // handle error
     });

fetch("https://jsonplaceholder.typicode.com/users")
.then(response => response.json())
     .then(arrayOfUsers => {
          log("typeof arrayOfUsers: " + typeof arrayOfUsers);
          log("arrayOfUsers.length: " + arrayOfUsers.length);
     })
     .catch(error => {                  // 3
          // handle error
     });

function log(msg) {
  var p = document.createElement("pre");
  p.appendChild(document.createTextNode(msg));
  document.body.appendChild(p);
}
Hide result

+8

Source: https://habr.com/ru/post/1675337/


All Articles