javascript - 对象中的项目为 'undefined' 的问题

Question

我正在尝试对对象数组进行排序和分组。但是，我遇到了一个问题，即调用键名称“Driver”返回“未定义”。

代码如下:

let hos = [
    {
        "Driver": "test-000000",
        "Date": "3/15/2020",
        "Status": "Off-Duty",
        "Time": "12:00 AM",
        "": "",
        "__1": "",
        "__2": ""
    },
    {
        "Driver": "test-000000",
        "Date": "3/16/2020",
        "Status": "Off-Duty",
        "Time": "12:00 AM",
        "": "",
        "__1": "",
        "__2": ""
    }
];

let hosByDriver = [];

hos.forEach((item, index) => {
// If the current item.Driver string match the previous or next '.Driver' push it to an array inside hosByDriver[targetedDriver] else push it by itself
    if (item.Driver == hos[index + 1].Driver || item.Driver == hos[index - 1].Driver) {
        hosByDriver[item.Driver].push(item);
    } else {
        hosByDriver[item.Driver].push(item);
    }
});

Answer 1

在第一次迭代中(索引为0)您的代码如下所示

hos.map((item, index) => {
    console.log(index);
    // neither hos[1] nor hos[-1] do exist -> undefined
    if (item.Driver == hos[0+1] || item.Driver == hos[0-1].Driver) {
        hosByDriver[item.Driver].push(item);
    } else {
        hosByDriver[item.Driver].push(item);
    }
});

所以它在第一轮就崩溃了。 hos[0-1].Driver 计算结果为 undefined.Driver。您可以使用&&来解决这个问题。

注意:数组[-1]不是无效语法

hos[index - 1] && hos[index - 1].Driver

此外，item.Driver 是一个字符串。数组通常按数字索引。我认为您打算使用对象来代替:

let hosByDriver = {};

hos.forEach((item, index) => {
  console.log(index);
  if (hos[index - 1] && (item.Driver === hos[index + 1] ||  item.Driver === hos[index - 1].Driver)) {
    //hosByDriver[item.Driver] = [];
    //hosByDriver[item.Driver].push(item);
  } else {
    hosByDriver[item.Driver] = [];
    hosByDriver[item.Driver].push(item);
  }
});

我还将 .map 更改为 .forEach，因为您没有返回新的数组，map 除外。如果您只想迭代，则 forEach 是等效的。

我只是猜测你想要实现什么，如果你提供更多细节，我可以提供更好的解决方案。看看这个代码和框:

https://codesandbox.io/s/stackoverflow-3h2n9

我认为您需要阅读一些有关 JavaScript 的基础知识(例如数据类型、循环等)。也就是说，继续学习! :)

更新: 如果我理解正确，您不想将具有相同名称的驱动程序分组到 hosByDriver 中，这些驱动程序存储在 hos.用例是访问驱动程序的所有项目，例如 hosByDriver['test-000000'] 并避免一遍又一遍地迭代整个数组，这是有道理的。

您可以通过执行以下操作轻松实现此目的

let hosByDriver = {};

hos.forEach(item => {

  // if item or item.Driver could be not what you expect you could check with 
  // item && item.Driver && typeof item.Driver === "string" 
  // in your if statement
  if(!hosByDriver[item.Driver]){ 
  // set hosByDriver[item.Driver] to empty array if it is undefined (more precisly: if its [falsy][1], meaning either 0, "", undefined, null ,NaN or false
    hosByDriver[item.Driver] = []
  }
  // append item to array at hosByDriver[item.Driver]
  // either empty or holding previous items
  hosByDriver[item.Driver].push(item);
});

信息:

在 JavaScript 中，数组实际上只是对象(键/值对)。如果你想了解更多可以观看JavaScript: Understanding the Weird Parts 。数组是一种特殊情况，您访问一个从零开始的数字的值，尽管我认为您无论如何都可以放置字符串 - 因为 JavaScript 非常宽容 - 我不建议这样做。当它变得更复杂时，你将很难调试。

也不建议使用 ==，而是使用 === 来防止 JS-Engine 尝试进行类型转换。例如。 0 == "" 产生 true。这也会给你带来很多麻烦。