javascript - 购物车挑战 JavaScript 逻辑。有不止一种方法可以解决吗？

Question

我刚刚完成了代码学院的 JS 介绍，所以我对此还很陌生。请看以下购物车挑战的两段代码。第一个是我在网上找到的正确代码，其中它扫描已经定义的数组，然后在输入一条信息(在本例中为“项目”)时输出另一条信息(“价格”)已收到。

这是“正确”的解决方案:

// Declare Array

var shoppingCart = [];

// Declare function addToCart 

addToCart = function(name,price) {
  this.name = name;
  this.price = price;
  shoppingCart.push(this.name,this.price);
};

function priceCheck(itemName) {
  var i = 0;
  for(i; i <= shoppingCart.length; i++) {
    if(itemName === shoppingCart[i]) {
     console.log(shoppingCart[i += 1]);
     break;
    }
      else {console.log("the searched item is not in the shopping cart");}
  }
}

如您所见，此人使用了 .this。

在我的代码中，我刚刚添加了一个对象(就像指示的那样)。我的逻辑是否完全错误，或者我只需要做一些修复？

我的代码:

shoppingCart = [];

function addToCart(itemName, itemPrice){
 const shiny = {
  name: itemName,
  price: itemPrice
 };
 shoppingCart.push(shiny);
 console.log(shoppingCart);
}

function priceCheck(itemName){
  for(i=0;i<=shoppingCart.length; i++){
    if(itemName===shoppingCart[i]){
      return itemPrice;
    } else{
      console.log('item isnt in cart');
  }}}

addToCart('apple',20);
console.log(shoppingCart);
priceCheck('apple');

它工作正常，直到到达priceCheck('apple'); - 那么我似乎在数组中找不到“苹果”。

我尝试了解是否需要使用 (.this) 以及是否可以按照我编写的方式进行操作。

PS - 抱歉，如果它很困惑，我很难解释我想要理解的内容:)PSS - 我不仅仅是想解决挑战，而是真正培养“解决问题的编码思维”。

谢谢!

Answer 1

“正确”的解决方案？而不是。

 addToCart = function(name,price) {

这是一个未声明且不必要的函数表达式。人们应该这样做:

 function addOne(name, price){

在这里访问this并不是一个好的做法，因为它具有误导性。如果您只是引用 OOP 代码，我总是只会使用 this。另外，以下内容对我来说毫无意义:

 shoppingCart.push(this.name,this.price);

因为将名称和价格添加为不同的数组元素。这设置了从未使用过的变量(为什么？):

 this.name = name;
 this.price = price;

所以在我看来，你的解决方案实际上比“正确的”解决方案更好。但有几点:

for(i=0;i<=shoppingCart.length; i++){

此迭代直到i等于长度，但由于数组是从零开始的，因此该位置没有元素。做:

 for(let i = 0; i < shoppingCart.length; i++)

此外，对象是通过引用进行比较的，但您实际上想通过值来比较它们。例如。你可以使用 name 属性:

  if(name === shoppingCart[i].name)

还有一个小提示，不要这样做:

}}}

<小时/>

我会怎么做:

  const cart = [];

  function addToCart(name, price){
    cart.push({name, price});
  }

  function priceOf(findName){
    for(const {name, price} of cart)
       if(findName === name) return price;
    return NaN;
  }