144

我有一本字典：

var driversCounter = {
    "one":   1,
    "two":   2,
    "three": 3,
    "four":  4,
    "five":  5
}

现在，我需要在下拉列表中显示它。如何获取字典中的键集合？

4

10 回答 10

235

在旧版浏览器中使用Object.keys()或填充它...

const keys = Object.keys(driversCounter);

如果你想要values，那么Object.values()如果你想要 key和value ，你可以使用，通常与这样Object.entries()配对......Array.prototype.forEach()

Object.entries(driversCounter).forEach(([key, value]) => {
   console.log(key, value);
});

或者，考虑到您的用例，也许这会做到......

var selectBox, option, prop;

selectBox = document.getElementById("drivers");

for (prop in driversCounter) {
   option = document.createElement("option");
   option.textContent = prop;
   option.value = driversCounter[prop];
   selectBox.add(option);
}
于 2012-05-18T15:00:00.783 回答
70

一种选择是使用Object.keys()：

Object.keys(driversCounter)

它适用于现代浏览器（但是，Internet Explorer 仅从版本 9开始支持它）。

要添加兼容支持，您可以复制MDN中提供的代码片段。

于 2012-05-18T15:00:12.983 回答
21

要遍历“字典”（我们在 JavaScript 中将其称为对象），请使用for in循环：

for(var key in driversCounter) {
    if(driversCounter.hasOwnProperty(key)) {
        // key                 = keys,  left of the ":"
        // driversCounter[key] = value, right of the ":"
    }
}
于 2012-05-18T15:00:41.437 回答
10

这将适用于所有 JavaScript 实现：

var keys = [];

for (var key in driversCounter) {
    if (driversCounter.hasOwnProperty(key)) {
        keys.push(key);
    }
}

像之前提到的其他人一样，您可以使用Object.keys，但它可能不适用于旧引擎。所以你可以使用下面的猴子补丁：

if (!Object.keys) {
    Object.keys = function (object) {
        var keys = [];

        for (var key in object) {
            if (object.hasOwnProperty(key)) {
                keys.push(key);
            }
        }
    }
}
于 2012-05-18T15:03:43.890 回答
8

只需使用Object.keys()：

var driversCounter = {
                      "one": 1,
                      "two": 2,
                      "three": 3,
                      "four": 4,
                      "five": 5
                     }
console.log(Object.keys(driversCounter));

于 2017-05-10T13:18:27.893 回答
5

借助现代 JavaScript 引擎，您可以使用Object.keys(driversCounter).

于 2012-05-18T15:00:09.457 回答
3

对于新浏览器：Object.keys( MY_DICTIONARY )将返回一个键数组。否则，您可能想走老路：

var keys = []
for(var key in dic) keys.push( key );
于 2012-05-18T15:00:47.030 回答
2

正如其他人所说，您可以使用Object.keys()，但谁在乎旧浏览器，对吧？

嗯，我愿意。

试试这个。array_keys从 PHPJS 移植PHP的便利array_keys功能，所以它可以在 JavaScript 中使用。

乍一看，Object.keys如果支持，它就会使用，但它处理不太容易的情况。它甚至包括根据您可能正在寻找的值过滤键（可选）以及是否使用严格比较===与类型转换比较==（可选）的切换。

于 2012-05-18T15:01:43.870 回答
1

如果你可以使用 jQuery 那么

var keys = [];
$.each(driversCounter, function(key, value) {
    keys.push(key);
});

console.log(JSON.stringify(keys));

以下是答案：

["one", "two", "three", "four", "five"]

这样您就不必担心浏览器是否支持该Object.keys方法。

于 2013-08-31T20:16:31.457 回答
-5

另一种方法是使用多维数组：

var driversCounter = [
    ["one", 1], 
    ["two", 2], 
    ["three", 3], 
    ["four", 4], 
    ["five", 5]
]

并通过 driverCounter[k][j] 访问该值，在这种情况下 j=0,1。
通过以下方式将其添加到下拉列表中：

var dd = document.getElementById('your_dropdown_element');
for(i=0;i<driversCounter.length-1;i++)
{
    dd.options.add(opt);
    opt.text = driversCounter[i][0];
    opt.value = driversCounter[i][1];
}
于 2012-05-18T15:10:02.837 回答