promise.then() returns 承诺 { <pending> }

Question

函数 fetchData return 是一个承诺，然后我通过将 promise 与 .then 链接起来处理 generateURL 函数中的承诺，但是 return 是 Promise <待定>。函数 generateURL 应该 return 一个字符串我做错了什么？

const fetch = require('node-fetch');

const fetchData = async () => {
  return await fetch('https://jsonplaceholder.typicode.com/todos/1');
};

const generateURL = () => {
  const baseURL = 'https://cdn.test.com/';
  fetchData().then((res) => {
    const data = res.json();
    console.log('data', data);
    const id = data.id;
    console.log('id', id);
    const generatedURL = `${baseURL}${id}`;
    return generatedURL;
  });
};

Answer 1

有一个return await是一个反模式https://eslint.org/docs/rules/no-return-await

const fetch = require('node-fetch');

const fetchData = () => {
  return fetch('https://jsonplaceholder.typicode.com/todos/1');
};

const generateURL = () => {
  const baseURL = 'https://cdn.test.com/';

  return fetchData().then((res) => {
    const data = res.json();
    console.log('data', data);
    const id = data.id;
    console.log('id', id);
    const generatedURL = `${baseURL}${id}`;

    return generatedURL;
  });
};

generateURL().then(result =>{
console.log(result)

})

Answer 2

您应该为 json() 的获取结果添加另一个 then()，如您在文档 https://www.npmjs.com/package/node-fetch#common-usage

中所见

所以，它可以像下面这样：

const generateURL = () => {
  const baseURL = 'https://cdn.test.com/';
   fetch('https://jsonplaceholder.typicode.com/todos/1')
   .then(res => res.json())
   .then(data => {
      console.log('data', data);
      const id = data.id;
      console.log('id', id);
      const generatedURL = `${baseURL}${id}`;

      return generatedURL;
  });
};

如果您仍想使用 fetchData 功能，则不需要 async-await，只需 return fetch，因为它已经 return 了答应。

Answer 3

稍微减少了您的代码，而不是添加多个 promise 解析

  const fetch = require('node-fetch');

const everything = async () =>{
    const response = await fetch('https://jsonplaceholder.typicode.com/todos/1');
    const {id} = await response.json();
    return `https://cdn.test.com/${id}`
}
everything().then((res)=>console.log(res));

promise.then() returns 承诺 { <pending> }

promise.then() returns Promise { <pending> }

javascript

api

node.js

async-await

es6-promise