Learn Basic OOP by Building a Shopping Cart - Step 23

JavaScript
1

Tell us what’s happening:

Frustrated…
I can’t even tell you what the problem is now - I have been trying and trying and mutilated my code to the point that I really don’t even remember my original code anymore. I keep going back to what is being asked for me to do and it seems clear but maybe I am interpreting it wrong. I have looked at W3 schools and the other big JS reference sites but their explanations are sometimes geared only to people with degrees in computer science - which is great - but don’t help those of us who do not.

So I’m not going to put my code here because it’s not even the original code I wrote that was wrong (I have been stuck on this step for two days now).

So my main question is: can someone explain destructuring syntax?
In my opinion freeCodeCamp has not done a very complete job of explaining how it works at this point in the curriculum. I think that if I understand the syntax better (especially as it relates to this particular step) I should be able to solve it. (I’m not trying to be critical here, I’m just trying to be honest).

My assumptions this far:

  1. When the console says use dot notation to access the id property of dessert, it means this:
dessert.id
  1. When the console says use bracket notation to access the dessert.id property of the totalCountPerProduct object, I’m guessing it means this:
totalCountPerProduct{dessert.id}

or this:

totalCountPerProduct[dessert.id]
  1. I know I am trying to increment the totalCountPerProduct of the dessert product in this step, so to me this looks something like this:
items.forEach((dessert) => {
  totalCountPerProduct{dessert.id += 1}
  };

But, I know this is wrong.

Additional questions:

1.Why does my console keep giving me errors:
i: [Reference error: Cannot find variable: shopping cart] x4
ii: Unexpected token, where the unexpected token occurs at the “t” in total in the line of code:
const totalCountPerProduct = {}; ???
iii: Use dot notation for dessert.id, and bracket notation for totalCountPerProduct, even when I do use dot and bracket notation?

  1. Why does this step seem to contradict itself with the instructions saying do not use the addition assignment operator, and the console saying literally: " You should update the value of totalCountPerProduct to be the current value plus one."

Any clarification on this point would be extremely helpful and appreciated.

PS: Why is there always an unexpected token on line 82 (or some other line by the bounds of code) when there is literally nothing at all there?

Your code so far

<!-- file: index.html -->


/* file: script.js */
// User Editable Region

  addItem(id, products) {
    const product = products.find((item) => item.id === id);
    const { name, price } = product;
    this.items.push(product);
  }

  const totalCountPerProduct = {
  
  this.items.forEach((dessert) => {
    dessert.id{totalCountPerProduct += 1
    });


// User Editable Region

/* file: styles.css */

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.4 Safari/605.1.15

Challenge Information:

Learn Basic OOP by Building a Shopping Cart - Step 23

2

Hi there!

Instructions is asking you:

you need to update the totalCountPerProduct object. Using the id of the current dessert as your property, update the value of the property to be the current value plus one. Do not use the addition assignment operator for this.

But you are using wrong syntax. You need to use bracket notation to add dessert.id to the totalCountPerProduct. then assign that current value plus one. Remember, You didn’t need the addition assignment operator .

3 
dessert.id // object notation
dessert["id"] // bracket notation 

let key = "id"
dessert[key] // same as dessert["id"]


 // initialize the variable by assigning a value
let totalCountPerProduct = 0

countItems(){
    this.items.forEach((dessert) => {
        // if dessert has a key named "id", add one to count
        if (dessert.id) {
           this.totalCountPerProduct += 1
        }
    })
}

/* best practice: 
    only use `const` when setting an explicit value
    use `let` when the the value could change
    helps avoid confusion

    const PRICE = 1.50
    let getPrice = () => PRICE
*/

destructuring is a short hand alternative to assigning variables

let person = ["john", 24, "NY"]

// with destructuring
let [name, age, state] = person

// without destructuring
let name = person[0]
let age = person[1]
let state = person[2]

console.log(name) // returns "john"
4

Hi there!

Maybe you are correct. But the challenge step is specific about instructions. So with above code, the challenge step will not pass.
Remember, posting solution code is not allowed here on the forum

5

thanks for responding…I didn’t mean to post the solution (I didn’t think I had because it still says I’m wrong. I have been stuck for weeeeeeeeks now on this one step. I’m pretty sure I have it right now but it still says I’m wrong…here is my current code:

    const product = products.find((item) => item.id === id);
    const { name, price } = product;
    this.items.push(product);
  }
  
    const totalCountPerProduct = {};

    this.items.forEach((dessert) => {
      totalCountPerProduct[dessert.id] = totalCountPerProduct[dessert.id] + 1;
    }

but I still get this in the console (and I no longer have the preview showing):

// running tests 1. You should use dot notation to access the

id

property of

dessert

. 2. You should use bracket notation to access the property of

totalCountPerProduct

that corresponds to

dessert.id

. 3. You should use the assignment operator to update the value of the property of

totalCountPerProduct

that corresponds to

dessert.id

. 4. You should update the value of

totalCountPerProduct

to be the current value plus one. // tests completed // console output [ReferenceError: Can’t find variable: ShoppingCart] [ReferenceError: Can’t find variable: ShoppingCart] [ReferenceError: Can’t find variable: ShoppingCart] [ReferenceError: Can’t find variable: ShoppingCart]

I’m about ready to give up because of this one step.

6

Hi!

The code is correct. It’s passing on my end. Reset the challenge step and try again Or try another browser.