我正在try 理解如何在不改变原始变量的情况下向对象添加元素.

举个例子,这就是我拥有的:

let orders = [];
const order = { name: "John", phone: "+12345" };

if (orders.length === 0) {
  orders = [{ ...order, invoice: "INV-1" }];
} else {
  let temp;
  temp = parseInt(orders[orders.length - 1].invoice.replace(/INV-/, ""));
  orders = [...orders, order];
  orders[orders.length - 1].invoice = `INV-${temp+1}`;
};

console.log(order)
console.log(orders);

我注意到,对于第一个条件,它是有效的,因为当Orders是空数组时,我没有看到变量"Order"发生变化.但是,例如,如果现在订单等于以下值:

let orders = [{name: "Maria", phone:"+19876", invoice:"INV-1"}];

我可以看到它通过了"Else"语句,其中的操作将新的键添加到Orders中,然而,变量Order也发生了Mutations .

我的问题是,例如,我如何在这个特定的例子中添加INV-2而不Mutations 顺序?

谢谢.

推荐答案

您可以使用扩散语法以与第一种情况相同的方式创建副本.

let orders = [];
const order = {
    name: "John",
    phone: "+12345",
};
function addOrder() {
  if (orders.length === 0) {
      orders = [{...order, invoice: "INV-1"}];
  } else {
      const temp = +orders[orders.length-1].invoice.replace(/INV-/, "");
      orders = [...orders, {...order, invoice: `INV-${temp+1}`}];
  }
}
addOrder();
addOrder();
console.log(orders);
console.log(order);

Javascript相关问答推荐

从连接字符串创建客户端时,NodeJS连接到CosmosDB失败

react 路由加载程序行为

成帧器运动中的运动组件为何以收件箱开始?

Klaro与Angular的集成

node TS:JWT令牌签名以验证客户端和后台问题之间的身份验证

格式值未保存在redux持久切片中

Phaser 3 console. log()特定游戏角色的瓷砖属性

自定义高图中的x轴标签序列

当点击注册页面上的注册按钮时,邮箱重复

无法读取未定义错误的属性路径名''

加载背景图像时同步旋转不显示的问题

我正在建立一个基于文本的游戏在react ,我是从JS转换.我怎样才能使变量变呢?

您能在卸载程序(QtInsteller框架)上添加WizardPage吗?

在使用REACT更改了CSS类之后,无法更改CSS样式

<;img>;标记无法呈现图像

传递方法VS泛型对象VS事件特定对象

匹配一个或多个可选重复的特定模式

我怎样才能得到一个数组的名字在另一个数组?

需要从对象生成列表

响应,Use Callback更新状态变量,该变量也存在于其依赖数组中,它如何防止无限重新呈现?