Learn Basic OOP by Building a Shopping Cart - Step 51

JavaScript
1

Tell us what’s happening:

calculateTotal() {
const subTotal = this.items.reduce((total, item) => total + item.price, 0);
const tax = this.calculateTaxes(subTotal);
this.total = subTotal + tax;
cartSubTotal.textContent = $${subTotal.toFixed(2)};
cartTaxes.textContent = $${this.tax.toFixed(2)};
cartTotal.textContent = $${this.total.toFixed(2)};

I can’t figure out what’s wrong.

Your code so far

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


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

  calculateTotal() {
    const subTotal = this.items.reduce((total, item) => total + item.price, 0);
    const tax = this.calculateTaxes(subTotal);
    this.total = subTotal + tax;
    cartSubTotal.textContent = `$${subTotal.toFixed(2)}`;
    cartTaxes.textContent = `$${this.tax.toFixed(2)}`;
    cartTotal.textContent = `$${this.total.toFixed(2)}`;
    
  }

// 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/18.3 Safari/605.1.15

Challenge Information:

Learn Basic OOP by Building a Shopping Cart - Step 51

2

It has to do with the this keyword. You are only using this. prefixed to your varibles because those same variables are in your class contructor as shown below. Do you need to use this. for a variable that is in declared locally (in your function) and not in your class constructor?

Here is some of your code:

    const tax = this.calculateTaxes(subTotal);
    this.total = subTotal + tax;
    cartSubTotal.textContent = `$${subTotal.toFixed(2)}`;
    cartTaxes.textContent = `$${this.tax.toFixed(2)}`;
    cartTotal.textContent = `$${this.total.toFixed(2)}`;
    
  }

The tax variable is declared and initialized or assigned a value in your local scope (in your function) so you don’t need this to get its value.

Here is the ShoppingCart class

class ShoppingCart {
  constructor() {
    this.items = [];
    this.total = 0;
    this.taxRate = 8.25;
  }

total is in your class constructor so to get the value for total you need to prefix it with this so your code knows what value you are refering to.

3

This might help: