javascript 使用扩散运算符更新对象值

1aaf6o9v 于 2023-01-01 发布在 Java

关注(0)|答案(3)|浏览(174)

我有一个函数，可以给传入的对象添加一个键，但是我被告知要使用spread操作符，我被告知我可以使用spread操作符，创建一个新的，具有相同属性的对象，然后在上面设置isAvailable。

return new Partner(ServerConfig, capabilities, initialState)
}

class Partner {
  constructor (ServerConfig, capabilities, initialState) {
    initialState.isAvailable = true

所以我尝试了类似的方法，但是没有成功，你能帮帮我吗？，我很困惑，我应该这样使用spread操作符吗，从一个函数返回？

newObject = {}

// use this inside a function and get value from return

       return {
         value: {
           ...newObject,
           ...initialState
         }
       }

initialState.isAvailable = true

JavaScript

来源：https://stackoverflow.com/questions/49491393/using-spread-operator-to-update-an-object-value

3条答案

按热度按时间

wlzqhblo1#

属性是按 * 顺序 * 添加的，因此如果要覆盖现有属性，需要将它们放在末尾而不是开头：

return {
  value: {
    ...initialState,
    ...newObject
  }
}

但是，您不需要newObject（除非您已经有了它）：

return {
  value: {
    ...initialState,
    isAvailable: newValue
  }
}

示例：

const o1 = {a: "original a", b: "original b"};
// Doesn't work:
const o2 = {a: "updated a", ...o1};
console.log(o2);
// Works:
const o3 = {...o1, a: "updated a"};
console.log(o3);

赞(0）回复(0）举报 2023-01-01

yruzcnhs2#

如果你知道属性的名称（下面例子中的a），那么@crowder的答案是完美的：

const o3 = {...o1, a: "updated a"};
console.log(o3);

如果属性名称在变量中，则需要使用Computed Property names语法：

let variable = 'foo'
const o4 = {...o1, [variable]: "updated foo"};
console.log(o4);

赞(0）回复(0）举报 2023-01-01

w7t8yxp53#

使用int ...扩展对象将保持状态的完整性。

initialState={isOpen:false,count:0}

假设您要添加另一个属性，但要保留其他属性：

return {  ...initialState,isAvailable:true
        }

这将导致

initialState={isOpen:false,count:0,isAvailable:true}

我们刚刚添加了一个新属性而没有丢弃其他属性.也许你的应用程序的另一部分正在使用其他属性，所以我们仍然保留它们.假设你想要更新isOpen状态.你首先扩展初始状态，然后添加最后一段逻辑

return {  ...initialState,isOpen:true
        }

这会导致

initialState={isOpen:true,count:0,isAvailable:true}

现在，在当前页面上，由于isOpen:true，您可能会向用户显示一个不同的UI，假设这次您要更新count，您也可以编写以下代码

return {  count:5 }

现在你的当前状态只有count:5，因此你的状态中的其他属性已丢失。现在没有isOpen属性。如果你在显示其他UI时未成功处理isOpen逻辑，则你的应用将崩溃。但如果处理正确，isOpen将导致falsy，因此你的页面将不会向用户显示该UI。

赞(0）回复(0）举报 2023-01-01

我来回答

javascript 使用扩散运算符更新对象值

3条答案

相关问题

热门标签

最新问答