array数据同步问题

Question

这里为什么push 整个item的话array1 和2同步。但是只push item里面一些属性就不行？可以只push一些属性的时候也同步吗

<template>
    <view>
        <view style="color: yellowgreen;" @click="click_a">点击测试a</view>
    </view>
</template>
 
<script>
    export default {
        data() {
            return {
                array1: [
                    {
                        title: "豆腐",
                        numList: [
                            {
                                client: "猫",
                                itemNum:3
                            },
                            {
                                client: "狗",
                                itemNum:13
                            },
                            {
                                client: "大帝",
                                itemNum:21
                            }
                        ]
                    },
                    {
                        title: "香肠",
                        numList: [
                            {
                                client: "猫",
                                itemNum:1
                            },
                            {
                                client: "狗",
                                itemNum:2
                            },
                            {
                                client: "大帝",
                                itemNum:3
                            }
                        ]
                    },
                    {
                        title: "芝士",
                        numList: [
                            {
                                client: "猫",
                                itemNum:123
                            },
                            {
                                client: "狗",
                                itemNum:111
                            },
                            {
                                client: "大帝",
                                itemNum:110
                            }
                        ]
                    }
                ],
                array2: []
            };
        },
        methods: {
            click_a() {
                let item = this.array1[0]
                this.array2.push({
                    //直接push item。array1 array2同步。但是像下面这样就不行
                    title: this.array1[0].title,
                    client: this.array1[0].numList[0].client,
                    itemNum: this.array1[0].numList[0].itemNum
                })
                console.log("this.array2 is: ", this.array2)
                this.array1[0].numList[0].client = "超级猫"
                console.log("this.array1[0] is: ", this.array1[0])
                console.log("this.array2 is: ", this.array2[0])
            }
        }
    }
</script>
 
<style lang="scss">
 
</style>
 
 

Answer 1

以下回复引自免费微信小程序：皆我百晓生。 如问题解决，还请采纳。如仍有疑问，请回复留言或私信博主，以便获得更精准的帮助。

在JAVASCRIPT中，当你使用PUSH操作数组时，你可以同时添加多个元素或删除多个元素。然而，在你想要从另一个对象（例如，数组）中获取某些属性之前，你需要先将这些属性添加到这个对象的某个属性上。这就是为什么你不能直接在另一个对象上调用PUSH操作，因为这会改变原本的THIS指向，而不会立即更新其他对象的引用。

如果你需要从另一个对象中获取某些属性，但又不想直接改变原来的THIS值，你可以使用PUSH操作来实现这一点。这样做的好处是，你可以在不破坏原始对象的情况下修改它。

以下是一个示例：

VAR OBJ = {
  NAME: 'JOHN',
  AGE: 30,
  ADDRESS: {
    STREET: '123 MAIN ST',
    CITY: 'ANYTOWN'
  }
};

// 使用 PUSH 操作
OBJ.PUSH('ADDRESS.STREET');

CONSOLE.LOG(OBJ.ADDRESS.STREET); // 输出：123 MAIN ST

// 使用 SET 方法
OBJ.SET('NAME', 'JANE');
OBJ.SET('AGE', 35);

在这个例子中，我们首先创建了一个名为OBJ的对象，并添加了三个属性。然后我们调用了PUSH方法，将一个属性添加到了对象的ADDRESS属性上。最后，我们通过设置属性的值来更新这个对象的值。

如果SET方法用于更改对象的键和值，那么即使PUSH操作没有立即影响原始对象，也不会改变它的状态。因此，如果你想在不需要改变原对象的状态下访问某些属性，那么你可能需要使用SET方法。