数组中的对象未在JavaScript中更新

我在Angular应用程序中编写了几行typescript代码，构造函数中有几个布尔变量，还有一个object数组。数组中每个object的一部分都由输入变量组成

selftest: boolean;
failed: boolean;

    locoStateItems = [
    {
        name: 'FAILED',
        isSelected: this.failed
    },
    {
        name: 'SELFTESTED',
        isSelected: this.selftest
    }

稍后在另一个函数中

toggleMe(name: string){
   if (name === 'FAILED') {
       this.failed = !this.failed
   } else if(name === 'SELFTESTED'){
       this.selftest = !this.selftest;
   }
}

除非我显式编写以下代码，否则DOM中显示的locostatItem不会受到影响

locoStateItem[0].isSelected = this.failed;
locoStateItem[1].isSelected = this.selftest;

---

对此的解释是什么？我如何避免它？

这是因为布尔是一个基元，这意味着您在声明数组时只是赋值。这不会将引用指定给布尔变量，因此它们不会在数组对象中自动更新

如果要保留此结构，则必须手动更新数组对象的布尔值

根据我的假设，您应该将函数更改为：

toggleMe(name: string){
   if (name === 'FAILED') {
       this.failed = !this.failed;
       this.locoStateItem[0].isSelected = this.failed;
   } 
   else if(name === 'SELFTESTED'){
       this.selftest = !this.selftest;
       this.locoStateItem[1].isSelected = this.selftest;
   }
}

---

我不确定此方法的目的是什么，但从我从您的问题中可以看出，这应该是功能性的。

此功能中的

未引用您需要引用的对象。即使会，布尔是一个基本元素，对象中最初指定的值也不会改变。感谢完整的答案：）