javascript - 在 Javascript 中创建和引用对象数组

Question

我正在尝试创建一个包含任务和子任务的通用待办事项列表。任何给定的待办事项列表都会有一个或多个任务，每个任务都会有一个或多个子任务。对于每个子任务，我都会显示显示任务和子任务的卡片，以及有关用户的一些其他相关信息。因此，为任何给定列表呈现的卡片数量等于子任务的数量，并且可以按任务进行分类。

对我来说，棘手的部分是我需要能够引用这些卡(因为我将进行 API 调用以从不同类型的列表中获取任务和子任务数据——顺便说一句，这两者都是数组)，并且我不确定引用有效具有 2 个索引(任务和子任务)的内容的最佳方法。

我的想法主要集中在创建任务:子任务对象的 toDoList 数组 [{任务 1, 子任务 1}, {任务 1, 子任务 2}, {任务 2, 子任务 1), 等等}] ——但是当我开始这样做时，我陷入了两个地方:

1. 以编程方式创建键值对(我使用嵌套循环来迭代任务和子任务)

2. 稍后如何引用它们，因为我需要将这些任务:子任务对与特定的 DOM 对象关联起来，以执行诸如隐藏它们之类的功能。

我有一些代码，但感觉离目标很远，所以甚至不包括在这里。基本上，我觉得有一个不到十几行代码的简单解决方案，比我更好的程序员会立即看到，并且我将不胜感激。非常感谢!

Answer 1

不确定您对编写数据结构有多少控制权，但也许这样的东西会起作用。

这里的想法是，为所有子任务提供一个 ID，然后通过子任务 ID 数组来跟踪任务的子任务。

var tasks = [
  {name: 'clean apartment', subtasks: [1, 2, 3]},
  {name: 'do the dishes', subtasks: [6]},
  {name: 'eat lunch', subtasks: [4, 5]}
];

var subtasks = [
  {name: 'vaccuum', id: 1},
  {name: 'dust', id: 2},
  {name: 'wipe down', id: 3},
  {name: 'make sandwich', id: 4},
  {name: 'drink a beer', id: 5},
  {name: 'soak pans', id: 6}, 
];


var i, j, l = tasks.length;
for(i; i < l; i++) {
  var task = tasks[i],
      ll = task.subtasks.length;
  for(j=0; j < ll; j++) {
    // Now you know the parent task and all its subtasks
  }
}

此外，如果您不介意使用 underscore 这样的库的帮助，你可以用相反的方式来做。通过这种方式，您可以为所有任务提供一个 ID，然后为子任务提供一个 task 字段，该字段将它们映射到任务。使用underscore's findWhere您可以在迭代每个子任务时轻松查找任务。

var tasks = [
  {name: 'clean apartment', id: 1},
  {name: 'do the dishes', id: 2},
  {name: 'eat lunch', id: 3}
];

var subtasks = [
  {name: 'vaccuum', task: 1},
  {name: 'dust', task: 1},
  {name: 'wipe down', task: 1},
  {name: 'make sandwich', task: 3},
  {name: 'drink a beer', task: 2},
  {name: 'soak pans', task: 2}, 
];

for(var i = 0; i < subtasks.length; i++) {
  var subtask = subtasks[i],
      task = _.findWhere(tasks, {id: subtask.task})
  // Now you know the subtask and its task
}

根据我帖子的评论，我还创建了一个 fiddle 来给出创建子任务卡的示例:http://jsfiddle.net/grammar/ynw0eb25/