遍历 Javascript 中的字典答案

【问题标题】：Iterating over a dictionary in Javascript遍历 Javascript 中的字典
【发布时间】：2015-12-24 07:06:12
【问题描述】：

我对 Javascript 还很陌生，并试图在 Javascript 中迭代字典。我可以在 python 中轻松做到这一点：

for key, value in dict.items():
    //do something

在 Javascript 中是否有类似的方法可以做到这一点？

我试图迭代的结构是：

{ 'meta.num_prod': 4,
  'meta.crtd_on': '2015-12-24T06:27:18.850Z',
  'meta.last_upd': '2015-12-24T06:46:12.888Z',
  's.103114': 
     { prod_id: '103114',
       product_type: 'normal',
       last_updated: '2015-12-24T06:28:44.281Z',
       qty: 3,
       created_on: '2015-12-24T06:27:18.850Z' },
  's.103553': 
     { prod_id: '103553',
       product_type: 'normal',
       last_updated: '2015-12-24T06:46:12.888Z',
       qty: 1,
       created_on: '2015-12-24T06:46:12.888Z' } }

【问题讨论】：

How do I enumerate the properties of a JavaScript object?的可能重复
@Pang 回答没有那么广泛。也有点老了。

标签： javascript object dictionary

【解决方案1】：

这个标准方法有多种方法是使用 Object.keys：

你可以的

Object.keys(obj).forEach(function(key) {
   console.log(key + " " + obj[key]);
});

如果你使用 jQuery，你可以使用$.each() 方法，如下所示：

$.each({ name: "John", lang: "JS" }, function( k, v ) {
  console.log( "Key: " + k + ", Value: " + v );
});

或者您可以使用for...in loop，但我认识的大多数人现在都不使用它们，因为有更好的选择。

for (var prop in obj) {
  console.log("obj." + prop + " = " + obj[prop]);
}

如果您最终想要使事情复杂化，您可以像这样使用es6 generators 来获得更类似于 python 的语法：

// The asterisk after `function` means that
// `objectEntries` is a generator
function* objectEntries(obj) {
    let propKeys = Reflect.ownKeys(obj);

    for (let propKey of propKeys) {
        // `yield` returns a value and then pauses
        // the generator. Later, execution continues
        // where it was previously paused.
        yield [propKey, obj[propKey]];
    }
}

let jane = { first: 'Jane', last: 'Doe' };
for (let [key,value] of objectEntries(jane)) {
    console.log(`${key}: ${value}`);
}
// Output:
// first: Jane
// last: Doe

【讨论】：

您的回答比庞提到的问题中的回答“更广泛”吗？它也没有什么新东西......而且由于 Ajay 是初学者，因此还应该添加一些 good 文档的链接。
@Andreas 有 8 个答案都有 for...in 循环，没有别的。我会添加文档感谢您提及它。
for...in, Object.keys, $.each, 一些自定义方法（使用for...in）和一个引用underscore.js的方法。
@Andreas $.each 甚至没有在整个页面上提及。 Object.keys 没有示例，大多数人甚至不再使用下划线；他们使用 Lodash。这是一个旧线程，我试图帮助一个人看到更多选择而不必挖掘。这有什么问题吗？
现在这很广泛！谢谢一吨！尽管我能够使用@Pang 的链接！

【解决方案2】：

EcmaScript 2017 有 Object.entries 在这种情况下派上用场。 MDN

const obj = { 
    'meta.num_prod': 4,
    'meta.crtd_on': '2015-12-24T06:27:18.850Z',
    'meta.last_upd': '2015-12-24T06:46:12.888Z',
}

Object.entries(obj).forEach(function([key, value]) {
   console.log(`${key} ${value}`);
});

输出：

meta.num_prod 4
meta.crtd_on 2015-12-24T06:27:18.850Z
meta.last_upd 2015-12-24T06:46:12.888Z

【讨论】：