在 "容器 "类属性对象中添加多个类实例。

Posted 2021-03-19

我创建了两个类，jsCart代表一个店铺的购物车，jsProduct代表一个产品。

jsCart应该有一个对象作为属性来存储jsProduct实例。

我的问题是如何将jsProduct实例添加到jsCart的那个对象属性中。

这是jsCart(相关位)

class jsCart {
  constructor() {
    this.products = {};
    this.sum = 0;     
  }

  set _products(product) {
    this.products[product.id] = product;
  }

  remove(id) {
    delete this.products[id];
  }

  updateSum() {
    for (var product in this.products) {
      this.sum += this.products[product]['sum'];
    }
  }
}

和jsProduct（相关位）。

class jsProduct {
  constructor(id, price, quantity) {
    this.id = id;
    this.price = price;
    this.quantity = quantity;
    this.sum = this.price * this.quantity;
  }

  set _quantity(n) {
    this.quantity = n;
    this.sum = this.price * this.quantity;
  }
}

还有我试图将一个产品添加到购物车中的尝试。

jsCart._products = new jsProduct('bananas',23,1);

这看起来确实有效，但当我尝试添加另一个产品时，如果我正确使用chrome的控制台，它似乎会覆盖第一个产品。

也许我应该使用getter来查看.products的内容？ 或者是关于setter的问题，或者是我如何使用它？

谢谢你的帮助

答案

我只需要做一个名为addItem的方法，然后将项目添加到 "购物车 "中，而不是像你现在这样做。

class jsCart {
  constructor() {
    this.products = {};
    this.sum = 0;     
  }
  //You don't really need this
  //set _products(product) {
  //  this.products[product.id] = product;
  //}

  //This should work
  addProduct(product){
    this.products[product.id] = product;
  }

  remove(id) {
    delete this.products[id];
  }

  updateSum() {
    for (var product in this.products) {
      this.sum += this.products[product]['sum'];
    }
  }
}

cart.addProduct(...);

另一答案

首先，你不应该给你的类实例取与类本身相同的名字。此外，javascript类名的惯例是用Pascal Casing来写。

所以，在你的例子中，应该是这样的。

class JSCart{
   ....
}

要创建一个类的实例 JSCart:

let jsCart = new JSCart();

此外，我会考虑用你做的方式使用一个setter，因为setter不会有不好的风格。设置 价值 products但它 补充 产品到您的 products. 更好的方法是创建一个方法来添加一个新产品。

从技术上讲，你的解决方案应该是可行的。唯一不能工作的是用一个不存在的getter来检索当前的产品（在你的案例中，你的 jsCart._products). 相反，你可以模拟访问产品作为你的购物车的一个属性。

创建两个产品并检索购物车的产品的例子。

另外，重新考虑是否需要将产品存储在一个对象中。在我看来，一个数组会更适合你的情况.当以你的方式使用一个对象时，你不可能添加两个相同名称的产品（例如 "apple "和 "apple"），因为第二个产品会覆盖第一个产品.使用对象的好处是可以直接通过它的名称访问产品。如果你不需要这样做，你只需要存储已经添加到用户购物车中的产品，最好使用数组。