为什么此代码返回未定义以及如何使此代码工作

时间:2020-01-26 16:59:41

标签: javascript promise

对api的请求成功返回了预期的数据。 api中的数据将保存到“事实”变量。问题是,“ getData”函数返回应解决的promise 数据,而是返回未定义。


const getData = num => {
  let fact;
  if (Array.isArray(num)) {
    fetch(`http://numbersapi.com/${num[0]}/${num[1]}/date`)
      .then(response => response.text())
      .then(data => {
        fact = data;
      });
  } else if (num.math === true) {
    fetch(`http://numbersapi.com/${num.val}/math`)
      .then(response => response.text())
      .then(data => {
        fact = data;
      });
  } else {
    fetch(`http://numbersapi.com/${num}`)
      .then(response => response.text())
      .then(data => {
        fact = data;
      });
  }
  return new Promise((resolve, reject) => {
    resolve(fact);
  });
};

getData([1, 26]).then(val => {
  console.log(val);
});

1 个答案:

答案 0 :(得分:2)

Fetch是基于Promise的api,它返回一个Promiss,并且您不需要将Fetch封装在Promise中。

您可以在if检查中准备url字符串,然后在fetch调用中使用它。

示例

const getData = num => {
  let url;
  if (Array.isArray(num)) {
    url = `http://numbersapi.com/${num[0]}/${num[1]}/date`;

  } else if (num.math === true) {
    url = `http://numbersapi.com/${num.val}/math`;

  } else {
    url = `http://numbersapi.com/${num}`
  }
  return fetch(url);
};

getData([1, 26]).then(response => {
  console.log(response.text());
});