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

Creating and referencing an array of objects in Javascript

本文关键字：引用 对象 数组 创建 Javascript      更新时间：2023-09-26

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

对我来说棘手的部分是，我需要能够引用这些卡片(因为我将做一个API调用来获取任务和子任务数据-这两个都是数组，顺便说一下-从不同类型的列表)，我不确定引用有效地有2个索引(任务和子任务)的东西的最佳方式。

我的想法一直集中在创建任务的toDoList数组:子任务对象[{task 1, subtask 1}, {task 1, subtask 2}, {task 2, subtask 1), etc}] -但是当我开始这样做时，我被困在两个地方:

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

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

我有一些代码，但它感觉真的太远了，所以甚至没有包括在这里。基本上，我觉得有一个少于十几行代码的简单解决方案，比我更好的程序员会立即看到，我很感激你的帮助。很多谢谢!

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

这里的想法是给所有子任务一个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字段，将它们映射到一个任务。使用下划线的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
}

从我的帖子的评论中，我也创建了一个小提琴来给出一个创建子任务卡的例子:http://jsfiddle.net/grammar/ynw0eb25/

这样的结构可以胜任这项工作吗?

[    
    {taskId: '1', 
     subtasks:[{subtaskId:'1', otherAttributes:'...'}, 
               {subtaskId:'2', otherAttributes:'...'},
                ...
              ]
     },
    {taskId: '2', 
     subtasks:[{subtaskId:'1', otherAttributes:'...'}, 
               ...
              ]
    }
    ....
]

相关文章：