javascript - 基于其他总计计算总计 Vanilla JavaScript

Question

我按照教程制作了一个使用 localstorage 的购物车。现在我正在尝试对其进行调整以适应我自己的需要，以扩展我对 JavaScript 的知识并给自己更多的练习。讲师为每个单独的项目总计做了一个 div(即 4 个香蕉 0.25 美元是 1.00 美元)，但我想在我的购物车底部添加一个“总计”部分。我正在努力寻找一种计算方法。这是购物车的代码(最底部是我为总计添加的代码)

我知道如何以及在哪里设置新的 div，以便它显示在我想要的位置，但我不知道如何计算总计。我知道我需要将它基于单个购物车项目，这样就可以在设置“成本”变量的行上，但是已经尝试了几件事并且显然不知道我在做什么。帮助!

const CART = []

function showCart() {
  let cartSection = document.getElementById("cart");
  cartSection.innerHTML = "";
  let s = CART.sort();
  s.forEach(item => {
    let cartitem = document.createElement("div");
    cartitem.className = "cart-item";

    let title = document.createElement("h3");
    title.textContent = item.title;
    title.className = "title";
    cartitem.appendChild(title);

    let controls = document.createElement("div");
    controls.className = "controls";
    cartitem.appendChild(controls);

    let plus = document.createElement("span");
    plus.textContent = "+";
    plus.setAttribute("data-id", item.id);
    controls.appendChild(plus);
    plus.addEventListener("click", incrementCart);

    let qty = document.createElement("span");
    qty.textContent = item.qty;
    controls.appendChild(qty);

    let minus = document.createElement("span");
    minus.textContent = "-";
    minus.setAttribute("data-id", item.id);
    controls.appendChild(minus);
    minus.addEventListener("click", decrementCart);

    let price = document.createElement("div");
    price.className = "price";
    let cost = new Intl.NumberFormat("en-CA", {
      style: "currency",
      currency: "CAD"
    }).format(item.qty * item.itemPrice);
    price.textContent = cost;
    cartitem.appendChild(price);

    cartSection.appendChild(cartitem);

  });

  let total = document.createElement("div");
  total.className = "total";
  // Insert "grandTotal" code here.
  const grandTotal = 0
  total.textContent = grandTotal;

  cartSection.appendChild(total);
}

showCart()

<div id="cart"></div>

Answer 1

改变

s.forEach(item => {

到

let grandTotal = 0;
s.forEach(item => {

和改变

let cost = new Intl.NumberFormat("en-CA", {
      style: "currency",
      currency: "CAD"
    }).format(item.qty * item.itemPrice);

到

const val = item.qty * item.itemPrice;
grandTotal += val;
let cost = new Intl.NumberFormat("en-CA", {
      style: "currency",
      currency: "CAD"
    }).format(val);