Warum macht $ .Each Array-Objekt undefiniert, aber for-Schleife funktioniert

Question

Ich versuche, durch eine Baumstruktur zu iterieren. Die Struktur ist ein Array von JSON-Objekten. Wenn ich in einer For-Schleife iteriere, ist alles in Ordnung ... aber wenn ich mit $ .each iteriere, wird das iterierte Objekt undefiniert. Jede Hilfe, die das verstehen würde, wäre großartig.

HTML - gleiche sowohl für

<ul id="treeList" class="list-group" style="margin: 0 auto; list-style-type: none;"></ul>

-Code - Arbeitsversion

var tree = [{ 
    "name": "Parent 1", 
    "subcat": [] 
    }, 
    { 
    "name": "Parent 2", 
    "subcat": [{ 
     "name": "child 2", 
     "subcat": [{ 
     "name": "grandchild 2", 
     "subcat": [] 
     }] 
    }] 
    }, 
    { 
    "name": "Parent 3", 
    "subcat": [] 
    } 
]; 

buildTree($('#treeList'), tree); 

function buildTree($list, nodes) { 

    for (var i = 0, len = nodes.length; i < len; i++) { 
    var $item = $('<li><a href="#">' + nodes[i].name + '</a></li>'); 

    if (nodes[i].subcat.length) { 
     var $subList = $('<ul></ul>'); 
     $item.append($subList); 
     buildTree($subList, nodes[i].subcat); 
    } 

    $list.append($item); 

    } 
} 

Fiddle: https://jsfiddle.net/number40/0vpusefr/

-Code - nicht funktioniert:

var tree = [{ 
    "name": "Parent 1", 
    "subcat": [] 
    }, 
    { 
    "name": "Parent 2", 
    "subcat": [{ 
     "name": "child 2", 
     "subcat": [{ 
     "name": "grandchild 2", 
     "subcat": [] 
     }] 
    }] 
    }, 
    { 
    "name": "Parent 3", 
    "subcat": [] 
    } 
]; 

buildTree($('#treeList'), tree); 

function buildTree($list, nodes) { 

    $.each(nodes, function(node) { 

    var $item = $('<li><a href="#">' + node.name + '</a></li>'); 

    if (node.subcat.length) { 
     var $subList = $('<ul></ul>'); 
     $item.append($subList); 
     buildTree($subList, node.subcat); 
    } 

    $list.append($item); 

    }); 
} 

Fiddle für nicht funktioniert: https://jsfiddle.net/number40/qmLr14k8/

Answer 1

ich den Fehler in Sie Code gefunden, der jeweils Funktionen ersten Parameter der Index.

function buildTree($list, nodes) { 

    $.each(nodes, function(index, node) { 

    var $item = $('<li><a href="#">' + node.name + '</a></li>'); 

    if (node.subcat.length) { 
     var $subList = $('<ul></ul>'); 
     $item.append($subList); 
     buildTree($subList, node.subcat); 
    } 

    $list.append($item); 

    }); 

Ersetzen von diesem sollte funktionieren.