使用嵌套的 $.each 遍历对象

Question

我在使用嵌套的 $.each 遍历对象时遇到问题。该对象是嵌套在 rootObject.

下的一系列相同 type/class 的对象

对象

var rootObject ={};

rootObject.reportObject1.name = "reportObject1 Name";
rootObject.reportObject1.prop1 = "reportObject1 Prop1_Value";
rootObject.reportObject1.prop2 = "reportObject1 Prop2_Value";

rootObject.reportObject1.reportObjectA.name = "reportObjectA Name";
rootObject.reportObject1.reportObjectA.prop1 = "reportObjectA Prop1_Value";
rootObject.reportObject1.reportObjectA.prop2 = "reportObjectA Prop2_Value";

循环

$.each(rootObject, function(index0, value0){
  console.log(value0.name);

  $.each(value0, function(index1, value1){
    console.log(value1.name);
  }

}

问题

value1.name 是 returning 对象属性而不是循环中的名称。它似乎试图 return value.name for prop1 & prop2，导致 "undefined" 值。
在调试期间查看 value0 的值时，value0 在进入嵌套循环时似乎失去了它的值。即在 console.log(value1.name)、value0，从父循环变为 undefined；
在调试期间查看子循环 (index1, value1) 时，我看到 value1 现在等于 value0.name，而 index1 等于 "name"。

Answer 1

您可以自动定义属性一个级深度，但对于两个您需要停止并实例化父级：

var rootObject ={};

rootObject.reportObject1 = {}; // HERE
rootObject.reportObject1.name = "reportObject1 Name";
rootObject.reportObject1.prop1 = "reportObject1 Prop1_Value";
rootObject.reportObject1.prop2 = "reportObject1 Prop2_Value";

rootObject.reportObject1.reportObjectA = {}; // and HERE
rootObject.reportObject1.reportObjectA.name = "reportObjectA Name";
rootObject.reportObject1.reportObjectA.prop1 = "reportObjectA Prop1_Value";
rootObject.reportObject1.reportObjectA.prop2 = "reportObjectA Prop2_Value";

否则，none 这些属性实际上会被定义，从而导致您的 undefined 结果。

下一个问题是另一个语法问题：您在两个 $.each() 调用中缺少右括号：

$.each(rootObject, function(index0, value0){
  console.log(value0.name);

  $.each(value0, function(index1, value1){
    console.log(value1.name);
  }); // HERE

}); // and HERE

通过这两个修复，您的控制台输出显示：

reportObject1 Name
undefined (x3)
reportObjectA Name

要获得正确的输出，或者至少是一些示例输出，您可以使用这个小 gem (from here)。因为您的结构可能有两个以上的级别，递归在这里似乎是合适的。

function enumerate(o,s){

    //if s isn't defined, set it to an empty string
    s = typeof s !== 'undefined' ? s : "";

    //iterate across o, passing keys as k and values as v
    $.each(o, function(k,v){

        //if v has nested depth
        if(typeof v == "object"){

            //write the key to the console
            console.log(s+k+": ");

            //recursively call enumerate on the nested properties
            enumerate(v,s+"  ");

        } else {

            //log the key & value
            console.log(s+k+": "+String(v));
        }
    });
}

如果您尝试 enumerate(rootObject)，您将得到：

reportObject1: 
   name: reportObject1 Name
   prop1: reportObject1 Prop1_Value
   prop2: reportObject1 Prop2_Value
   reportObjectA: 
     name: reportObjectA Name
     prop1: reportObjectA Prop1_Value
     prop2: reportObjectA Prop2_Value

使用嵌套的 $.each 遍历对象

Loop through object with nested $.each

javascript

jquery

loops

object

nested-loops