代码重构：数组解构转对象解构后如何更新对象属性？

嘿，我来帮你梳理清楚这个问题～

首先得明确一个关键知识点：在JavaScript里，对象类型的参数是按引用传递的。也就是说，当你把personDetails传入getNames函数时，函数内部操作的其实就是原对象本身，不是它的副本。

你的当前实现：直接修改原对象 #

看你现在的getNames函数：

const getNames = (personDetails) => { 
  personDetails.firstName = 'Jack'; 
  personDetails.lastName = 'Jones'; 
}

当你调用getNames(personDetails)之后，原personDetails对象已经被修改了，根本不需要再写personDetails = getNames(personDetails)这种赋值语句。你可以直接验证效果：

let personDetails = { firstName: '', lastName: '', zipcode: 'xyz', age: 20, gender: 'm' };
getNames(personDetails);
console.log(personDetails.firstName); // 输出 "Jack"

这种方式的好处是简单直接，但缺点是函数会产生副作用（修改了外部传入的对象），如果代码逻辑复杂，可能会让调试变得麻烦——你很难快速追踪到到底是哪里修改了这个对象的属性。

更函数式的方案：返回新对象（推荐） #

如果你想遵循纯函数的设计原则（不修改输入参数，只返回新值），可以让getNames返回一个全新的对象，这时候就需要用赋值语句来更新personDetails了：

const getNames = (personDetails) => {
  // 用展开运算符复制原对象的所有属性，再覆盖firstName和lastName
  return {
    ...personDetails,
    firstName: 'Jack',
    lastName: 'Jones'
  };
}

// 调用时需要赋值来更新personDetails
personDetails = getNames(personDetails);

这种方式的优点很明显：

• 原对象不会被修改，彻底避免了副作用
• 代码逻辑更清晰，一眼就能看出来personDetails被重新赋值了
• 更符合现代JavaScript的函数式编程理念，便于后续的测试和维护

两种方案怎么选？ #

• 如果你的代码逻辑比较简单，且确定不会有其他地方依赖原对象的未修改状态，直接修改原对象是完全没问题的
• 如果你的项目追求可维护性、可测试性，或者需要保留原对象的初始状态，那返回新对象的方式会更稳妥

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