在JavaScript中为对象内部分配数组

贾廷·莱克瓦尔

我有cart和products全局变量。

产品可以具有多个属性。

这是一个代码

var products = [
                  {
                    name: 'Table',
                    price: 200,
                    attributes: [
                                  {
                                    name: 'Height',
                                    type: 'text',
                                    default_value: '',
                                  },
                                  {
                                    name: 'Width',
                                    type: 'text',
                                    default_value: '',
                                  }
                                ],
                  },
                  {
                    name: 'Chair',
                    price: 150,
                    attributes: [
                                  {
                                    name: 'Height',
                                    type: 'text',
                                    default_value: '',
                                  },
                                  {
                                    name: 'Width',
                                    type: 'text',
                                    default_value: '',
                                  },
                                  {
                                    name: 'Company',
                                    type: 'text',
                                    default_value: ''
                                  }
                                ],
                  }
              ];

var cart = {
  products: [],
};

//console.log('Initial cart',cart);

//add product to cart
let p = Object.assign({},products[0]);
cart.products.push(p);

//console.log('First cart', cart);
//change price
cart.products[0].price = 20;
//console.log('products',products);
//console.log('second cart',cart);

//change attribute of product
cart.products[0].attributes[0].value = 5;

此代码更改全局products value属性，而不是购物车属性。

请帮我解决这个问题。

穆罕默德·乌斯曼（Muhammad Usman）

从MDN

Object.assign()复制属性值。如果源值是对对象的引用，则仅复制该引用值。

就像products[0]数据中的对象一样，这就是您面临此浅表复制问题的原因

相反，您可以使用

let p = JSON.parse(JSON.stringify(products[0]));

var products = [{
        name: 'Table',
        price: 200,
        attributes: [{
                name: 'Height',
                type: 'text',
                default_value: '',
            },
            {
                name: 'Width',
                type: 'text',
                default_value: '',
            }
        ],
    },
    {
        name: 'Chair',
        price: 150,
        attributes: [{
                name: 'Height',
                type: 'text',
                default_value: '',
            },
            {
                name: 'Width',
                type: 'text',
                default_value: '',
            },
            {
                name: 'Company',
                type: 'text',
                default_value: ''
            }
        ],
    }
];

var cart = {
    products: [],
};

//console.log('Initial cart',cart);

//add product to cart
let p = JSON.parse(JSON.stringify(products[0]));
 
cart.products.push(p);

//console.log('First cart', cart);
//change price
cart.products[0].price = 20;
console.log('products',products);
console.log('second cart',cart);

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。