Question

未捕获（在承诺中）TypeError：

2020-01-25

3662

javascript

我尝试将 0-99 之间的数字添加到 myData 函数中，以便单击一次即可打印所有用户。但我收到错误。

Error: index.js:14 Uncaught (in promise) TypeError: Cannot read property 'userId' of undefined at index.js:14

function number() {
    for (let i = 0; i < 100; i++) {
        i;
    }
}

const myData = () =>  {
    fetch('https://jsonplaceholder.typicode.com/posts?fbclid=IwAR2aHkMfSVPYV3va38MKu-jOahl9G8UzyPJ1Dd67EyskMPZMw1gN9xi-AUg')
    .then(response => {
        return response.json();
    })
    .then(users => {
        document.getElementById('demo').innerHTML += `
        User ID: ${users[number()].userId}<Br> 
        ID: ${users[number()].id}<br> 
        Title: ${users[number()].title}<Br>
        Desc: ${users[number()].body}`;
    })
}

Answer 1

不清楚您希望 number() 函数做什么。正如您在问题中提到的那样，它将运行 for 循环，然后退出函数并返回 undefined 值。添加 return i 将导致它返回零并立即退出循环。

如果您的意图是将 demo id 的 innerHTML 设置为包含所有用户，那么您需要在循环内执行如下操作：

.then(users => {
  let allUsersHtml = "";
  for (let i=0; i<users.length; i++) {
    allUsersHtml += `
    User ID: ${users[i].userId}<br> 
    ID: ${users[i].id}<br> 
    Title: ${users[i].title}<br>
    Desc: ${users[i].body}`;
  }
  document.getElementById('demo').innerHTML = allUsersHtml;
})

这假设返回的 users 数据是一个 Array 对象。

您第一次尝试的主要问题在于理解函数的运行方式。每次调用时，它们只能返回一个内容。仅仅因为它们包含一个 for 循环并不意味着它们会在调用它们的函数中引起任何重复。