JavaScript中按条件修改对象属性值返回空对象如何修复

问题原因 #

你的代码存在两处逻辑错误：

1. 条件判断逻辑错误：你传入的第二个参数toChange是要修改的键名，但判断逻辑写的是obj[key] === toChange（判断属性值等于键名），示例中obj.name的值是carl，和传入的'name'永远不相等，因此不会执行赋值逻辑。
2. 未保留不匹配的属性：reduce的逻辑里只有条件匹配时才会给累加对象acc新增属性，不匹配的属性会直接丢失，就算条件写对也拿不到完整对象。

修复后的代码 #

const obj = {
  name: 'carl',
  age: 2
};

const filterF = (obj, toChange, newV) => {
  return Object.keys(obj).reduce((acc, key) => {
    // 先保留原对象所有属性
    acc[key] = obj[key];
    // 匹配到目标键时更新对应值
    if (key === toChange) {
      acc[key] = newV;
    }
    return acc
  }, {})
}


console.log(filterF(obj, 'name', 'newName'))
// 输出 { name: 'newName', age: 2 }

更简洁的实现 #

如果不需要兼容老旧运行环境，直接用对象展开语法实现更易读：

const filterF = (obj, toChange, newV) => {
  return {
    ...obj,
    [toChange]: newV
  }
}

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