javascript - 如何使用 jQuery.map 递归修改嵌套对象

Question

如何使用 jQuery.map(或 vanilla JS)递归修改嵌套对象？

// Original Object
var data = [{
    name: 'Parent',
    children: [{
        name: 'Child',
        children: [{
            name: 'ChildChild'
        }]
    }]
}];

// Resulting Object
var data = [{
    name: 'Parent',
    text: 'Parent',
    children: [{
        name: 'Child',
        text: 'Child',
        children: [{
            name: 'ChildChild',
            text: 'ChildChild'
        }]
    }]
}];

我目前在顶层使用 jQuery.map 这样做，但不知道如何递归实现。

$.map(data, function(obj){
    return $.extend(obj, {text: obj.name});
});

https://jsfiddle.net/minlare/0p0zb8vw/

Answer 1

不要使用 map() 修改数组；它旨在创建数组的子集。要修改数组，请使用 each() 或任何其他标准循环机制。

考虑到这一点，您可以在这种情况下使用 $.each() 来递归遍历数组每一层的对象。试试这个:

function setText(arr) {
    $.each(arr, function(i, obj) {
        obj.text = obj.name;
        if (obj.children && obj.children.length) {
            setText(obj.children);
        }
    });
}
setText(data);

Updated fiddle