Question

在Typescript中使用for循环时，for循环会更新整个数组。这是代码：

UpdatesToAllSelectedTabs() {

    if (this.selectedOuterTabs[1]) {
        this.outerTabs[1].InnerTabs = this.outerTabs[this.referencedOuterTab].InnerTabs;
        for (let j = 0; j < this.outerTabs[1].InnerTabs.length; j++) {
            this.outerTabs[1].InnerTabs[j].OuterTabId = this.outerTabs[1].Id;
        }
    }
}

代码的第一个版本也有外部循环，但它也不适用于固定外部索引（例如上面的= 1）。这段代码的作用如下：

如果选中，将innerTabs从引用的outerTab [0]复制到outerTab [1]。哪个好。然后，它将来自outerTabs [1]和outerTabs [0]的...... innerTabs [j] .OuterTabId设置为this.outerTabs [1] .Id。

有人可以解释一下这里发生了什么吗？为什么outerTab [0]也会更新？

Answer 1

从这一行：

this.outerTabs[1].InnerTabs = this.outerTabs[this.referencedOuterTab].InnerTabs;

似乎this.outerTabs[1]引用了与this.outerTabs[this.referencedOuterTab]相同的对象，因此如果您更改了一个，则也会更改另一个。

问题的一个更简单的例子：

let arr1 = [{ key: "value1" }, { key: "value2" }, { key: "value3" }];
let arr2 = new Array(...arr1);

console.log(arr1[1]); // {key: "value2"}
console.log(arr2[1]); // {key: "value2"}

arr2[1].key = "value2.2"

console.log(arr1[1]); // {key: "value2.2"}
console.log(arr2[1]); // {key: "value2.2"}

（code in playground）

要解决此问题，您需要分配不同的实例，例如使用Object.assign：

this.outerTabs[1].InnerTabs = Object.assign({}, this.outerTabs[this.referencedOuterTab].InnerTabs);

在我的例子中：

let arr1 = [{ key: "value1" }, { key: "value2" }, { key: "value3" }];
let arr2 = new Array(Object.assign({}, arr1[0]), Object.assign({}, arr1[1]), Object.assign({}, arr1[2]));

console.log(arr1[1]); // {key: "value2"}
console.log(arr2[1]); // {key: "value2"}

arr2[1].key = "value2.2"

console.log(arr1[1]); // {key: "value2"}
console.log(arr2[1]); // {key: "value2.2"}

（code in playground）

Javascript（Typescript）嵌套for循环更新所有元素，而不仅仅是内部循环

1 个答案: