JavaScript 中未知大小的多维数组

Question

我正在尝试将一个数组中的项目排序到另一个数组中，但已分类。我的代码当前正在运行，但问题是我需要知道“排序”数组的大小。目前，有四个条目与“数据”一起使用。前两个 data.cat 与 n 进行比较，并将它们的 ID 推入 sort[0]。当两者不匹配时，c 加 1。然后代码再次循环，将新的匹配项推入 sort[1] 等。

var data = [
            {"cat": 0, "id":"AAAA"},
            {"cat": 0, "id":"BBBB"},
            {"cat": 1, "id":"CCCC"},
            {"cat": 1, "id":"DDDD"},
            {"cat": 1, "id":"EEEE"},
            {"cat": 1, "id":"FFFF"}, //pseudodata
            {"cat": 1, "id":"GGGG"},
            {"cat": 2, "id":"HHHH"},
            {"cat": 2, "id":"IIII"},
            {"cat": 2, "id":"JJJJ"},
            {"cat": 3, "id":"KKKK"}
        ];

var sort = [[], [], [], [],]

function sortDates(){
    var n = 0;
    for (var i = 0; i < data.length; i++){      
        if (data[i].cat == n){
            console.log("Category " + n +" entry: " + data[i].id);
            sort[n].push(data[i].id);
        } else {
            console.log("Entry " + data[i].id + " does not match. Moving to next category...");
            n++;
            i--; 
        }
    }
}

这一切都正常，但是如果我向数据数组添加更多内容（例如 {"cat": 4, "id":"LLLL"}），程序就会崩溃并显示“sort[n] 不是函数”。这是因为排序数组中只有四个可用项目。

所以我只是想知道，有什么办法可以解决这个问题吗？如果数据数组总是改变大小，并且添加了更多条目/类别，我是否必须手动调整排序数组的大小？

Answer 1

您可以使用逻辑或

||

对数组进行默认检查，如果未设置该项目，则分配一个空数组。

sort[n] = sort[n] || [];
sort[n].push(data[i].id);

顺便说一句，您可以直接使用

cat

而无需迭代

sort

数组来获取正确的索引。

function sortDates() {
    var i, sort = [];
    for (i = 0; i < data.length; i++) {
        sort[data[i].cat] = sort[data[i].cat] || [];
        sort[data[i].cat].push(data[i].id);
    }
    return sort;
}

var data = [{ cat: 0, id: "AAAA" }, { cat: 0, id: "BBBB" }, { cat: 1, id: "CCCC" }, { cat: 1, id: "DDDD" }, { cat: 1, id: "EEEE" }, { cat: 1, id: "FFFF" }, { cat: 1, id: "GGGG" }, { cat: 2, id: "HHHH" }, { cat: 2, id: "IIII" }, { cat: 2, id: "JJJJ" }, { cat: 3, id: "KKKK" }],
    result = sortDates(data);

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 2

使用 ES6 以更简洁的方式实现此目的的另一种方法是使用

Array.reduce

并通过

Array.sort

在

String.localeCompare

内部：

var data = [{ "cat": 0, "id": "BBBB" }, { "cat": 0, "id": "AAAA" }, { "cat": 1, "id": "CCCC" }, { "cat": 1, "id": "DDDD" }, { "cat": 1, "id": "EEEE" }, { "cat": 1, "id": "FFFF" }, { "cat": 1, "id": "GGGG" }, { "cat": 2, "id": "HHHH" }, { "cat": 2, "id": "IIII" }, { "cat": 2, "id": "JJJJ" }, { "cat": 3, "id": "KKKK" } ]

const result = Object.values(data.reduce((r,c) => {
  r[c.cat] = [...r[c.cat] || [], c.id].sort((a,b) => a.localeCompare(b))
  return r
}, {}))
console.log(result)

String.localeCompare

在如何比较方面有多种选项（例如处理字符串中的数字、区分大小写等）

我们的想法是使用

Array.reduce

将对象中的条目分组，然后使用

Object.values

来获得所需的输出（多维数组）。