JS打印数据显示[object object]，如何单独输出列表与任务？

问题1 如何单独返回列表数据和任务数据 #

你输出[object Object]的核心原因是直接将存储对象的tasks数组传入document.write，JS 对对象执行默认的字符串转换时就会返回[object Object]。
另外你现有代码的遍历层级逻辑冗余，多套了一层不必要的遍历，不需要遍历整个用户对象，直接取用户的lists属性遍历即可，正确的遍历写法参考如下：

$.each(users, function (username, userData) {
  // 遍历当前用户下的所有待办列表
  $.each(userData.lists, function (listIdx, listItem) {
    // 这里就能单独拿到每个列表的所有数据，可按需取用
    const listData = {
      id: listItem.id,
      name: listItem.name
    }
    console.log('列表数据：', listData)
    document.write(`<div>列表名：${listItem.name}</div>`)

    // 遍历当前列表下的所有任务
    document.write(`<ul>对应任务：`)
    $.each(listItem.tasks, function (taskIdx, taskItem) {
      // 这里就能单独拿到每个任务的所有数据，可按需取用
      const taskData = {
        id: taskItem.id,
        content: taskItem.task
      }
      console.log('任务数据：', taskData)
      document.write(`<li>任务${taskItem.id}：${taskItem.task}</li>`)
    })
    document.write(`</ul>`)
  })
})

如果你只是需要把数据提取出来存为新数组，不需要输出到页面，可以这么写：

// 提取所有列表数据
const allLists = []
// 提取所有任务数据
const allTasks = []
$.each(users, function (username, userData) {
  $.each(userData.lists, function (listIdx, listItem) {
    allLists.push({id: listItem.id, name: listItem.name})
    $.each(listItem.tasks, function (taskIdx, taskItem) {
      allTasks.push({...taskItem, belongList: listItem.name})
    })
  })
})
console.log('所有列表：', allLists)
console.log('所有任务：', allTasks)

问题2 数据结构是否存在问题 #

你的数据结构没有错误，完全匹配「用户-待办列表-列表任务」的嵌套业务逻辑，属于合理的结构设计。
唯一可优化的点：当前lists数组里的id为0、1、3，存在跳号情况，如果你后续需要用id作为唯一标识做增删改查操作，建议保证id的全局唯一性，避免后续操作出现匹配冲突，这属于优化建议，不属于结构错误。

内容的提问来源于stack exchange，提问作者user17515150