如何在JSON path中使用路径变量修改JSON对象指定属性

问题原因 #

JavaScript 原生对象的方括号访问语法obj[key]仅支持直接传入单层键名，不会自动解析带点分隔符的嵌套路径，因此你传入完整路径字符串时会被当做顶层新键处理，这是符合语法规则的表现。另外你示例中对象的属性是大写开头的Name，路径写first.name也会因为大小写不匹配找不到目标属性。

解决方案 #

方案1：原生手动实现路径解析函数（无第三方依赖） #

你可以自己实现一个通用的嵌套路径赋值函数，逻辑是把路径按点拆分后逐层遍历对象到最后一级，再进行赋值：

const Data = {
    first:{
        "Name":"John",
        "Age":"43"
    }
}

let path = "first.Name" // 注意大小写和对象属性保持一致
let value = "Jan"

// 通用嵌套路径赋值函数
function setValueByPath(obj, path, value) {
  const keys = path.split('.')
  const lastKey = keys.pop()
  // 逐层遍历到目标属性的父级对象
  const target = keys.reduce((current, key) => {
    // 如果需要支持中间层不存在时自动初始化，可加上以下判断
    // if (!Object.hasOwn(current, key)) current[key] = {}
    return current[key]
  }, obj)
  target[lastKey] = value
}

setValueByPath(Data, path, value)
console.log(Data)

运行后即可得到你期望的输出结果。

方案2：使用第三方工具库 #

如果你的项目中已经引入了 Lodash 工具库，可以直接调用封装好的_.set方法，一行代码即可实现需求：

_.set(Data, path, value)

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