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

1つのオプションは次を使用してい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 に答える
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_keysfrom PHPJSポートPHP の便利なarray_keys機能なので、JavaScript で使用できます。

一見、Object.keysサポートされていれば使えますが、そう簡単に使えない場合にも対応しています。探している可能性のある値に基づいてキーをフィルタリングすること (オプション) や、厳密な比較===と型キャストの比較を使用するかどうかの切り替え (オプション) も含まれてい==ます。

于 2012-05-18T15:01:43.870 に答える
-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 に答える