JavaScript如何通过更新对象数组修改无固定路径嵌套对象的值

报错的核心原因是代码缺少必要的边界校验，具体问题和修复方案如下：

问题定位 #

• 你的嵌套对象中叶子节点不存在children属性，直接访问o.children.length时，o.children为undefined，会触发类型错误，执行上下文异常时会连带触发id读取的报错。
• 未校验更新对象和节点对象的属性存在性，极端情况下如果某条更新没有id属性、或者递归到空节点时，访问id属性会直接抛出对应错误。
• 匹配逻辑存在问题：你需要找id与更新项id完全相等的节点，原有代码写的update.id.includes(obj.id)会出现id包含关系的误匹配。

修复后代码 #

var updates = $('div.node').map(function() {
    return {
        id: $(this).attr("id"),
        content: $(this).find('div.content').text(),
        note: $(this).find('div.note').text()
    };
}).get();

const checkAndChange = (obj, update) => {
    // 前置校验参数合法性，避免读取undefined的属性
    if (obj && update && obj.id && update.id && obj.id === update.id) {
        obj.title = update.content;
        obj.note = update.note;
    }
}

const recursion = (obj, update) => {
    if (!obj) return;
    checkAndChange(obj, update);
    // 先判断children存在且为有效数组再遍历
    if (Array.isArray(obj.children) && obj.children.length > 0) {
        obj.children.forEach(child => recursion(child, update));
    }
    return obj;
}

// 此处替换为你自己的原始嵌套对象变量名
const originObj = 你的原始嵌套对象变量;

updates.forEach(update => {
    recursion(originObj, update);
});

console.log(originObj);

替换代码中你的原始嵌套对象变量为你自己声明的原始嵌套对象变量名，运行即可完成对应id节点的属性更新。

内容的提问来源于stack exchange，提问作者WilliamSlim