在angular tour Hero教程中，onSelect(hero: Hero)如何修改heroes=HEROES

Question

HeroesComponent类：

heroes=[ { id: 11，name：‘Dr. Nice’}，{ id: 12，name：'Narco‘}，{ id: 20，name：'Tornado’}

    onSelect(hero: Hero): void {
      this.selectedHero = hero;         /*How does this modify heroes model*/
    }

如果我选择id: 20，name：'Tornado‘，那么this.selectedHero ={ id: 20，name：'Tornado’}。

这将如何改变英雄模型。this.selectedHero和英雄之间的联系是如何建立的？我没看到任何二传手改变模型吗？this.selectedHero本身不是一个对象吗？

Answer 1

它不是角度的，但它更多的是关于Javascript对象的突变。

如果将Javascript对象分配给另一个变量，则内存将引用该对象。如果该变量的一个参数被更新，它会因为内存引用而自动更新原始对象。

你可以在这里阅读更多关于这方面的内容。https://alistapart.com/article/why-mutation-can-be-scary/

因此，如果您这样做

const heroes = [{id:1,name:"Kevin"},{id:2,name:"David"}];
const selectedHero = heroes[1];
selectedHero.name = "George"

最后，它将产生英雄作为

[{id:1,name:"Kevin"},{id:2,name:"George"}]

因为在您的示例中，this.selectedHero被直接分配给heroes数组中的一个项，所以它仍然具有内存引用，并且如果this.selectedHero被更新，它也会改变heroes数组。