Javascript数据结构:一组带有相关值的页面宽度

Question

我试图获得一组与不同窗口宽度相关的类。这些类到宽度对由用户设置。然而，我找不到正确的数据结构来存储它。我相信元组将是最理想的类型，但显然它们不存在于javascript中。如果他们这样做了，我的数据将是这样的:

var pageBreaks = [(900, "foo"), (600, "bar")];

在900px，我可以应用foo类。600px，我可以添加bar。我需要能够在.each()循环中访问"键"one_answers"值"。

我可以使用嵌套数组，如var pageBreaks = [[900, "foo"], [600, "bar"]];，但我认为这是非常丑陋的，特别是试图让我的插件的用户采用这种格式。

一个对象是可能的:

var pageBreaks = {
    900 : "foo",
    600 : "bar",
 }

但是循环时会更混乱，如果我保持它从大到小的顺序，处理起来会更容易，这在对象中是不能保证的(对吗?)

那么，处理这个"值-值"对数组的最佳数据结构是什么?

Answer 1

Map可能是一个很好的方法，假设您可以访问较新的JS语法:

let pageWidths = new Map();
pageWidths.set(900, "foo");
pageWidths.set(600, "bar");
// ordered
const orderedWidths = new Map([...pageWidths.entries()].sort());
// iteration with forEach
orderedWidths.forEach(console.log.bind(console));
// iteration with for...of
for (var [key, value] of orderedWidths) { 
   console.log(key, value); 
}

尽管它不会自己维护顺序(没有内置的JS数据结构会为你做这个*)，但map是相当容易使用的，并且很容易实现你的目标。

*除非您使用的数组与pageWidth整数作为索引，但即使这样也需要一点工作来过滤掉它们之间的undefined元素

Answer 2

您可以使用Hashmap数据结构来实现您的目标。我写了(正在写)一个JavaScript的数据结构库，并且已经完成了Hashmap部分，如果你有兴趣使用它。

您可以存储键-值对(或者在您的情况下，值-值对)，并按照插入的顺序对它们进行迭代。

const Hashmap = require('node-needle').Hashmap;
var map = new Hashmap();
map.put(900, "foo");
map.put(600, "bar");
// ...
// Iterate through map - insertion order is kept
for(var it = map.iterator(); it !== null; it = map.next()){
  console.log(it);          // 900 -> 600 -> ...
  console.log(map.get(it)); // "foo" -> "bar" -> ...
}