Javascript 根据其他总计计算总计

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

我知道如何以及在哪里设置新的div，以便它显示在我想要的位置，但我不知道如何计算总数。我知道我需要以单个购物车项目为基础，这样就可以设置“成本”变量，但我尝试了一些事情，显然不知道我在做什么。救命啊

const CART=[]
函数showCart（）{
让cartSection=document.getElementById（“cart”）；
cartSection.innerHTML=“”；
设s=CART.sort（）；
s、 forEach（项目=>{
让cartitem=document.createElement（“div”）；
cartitem.className=“购物车项目”；
让title=document.createElement（“h3”）；
title.textContent=item.title；
title.className=“title”；
cartitem.appendChild（标题）；
let controls=document.createElement（“div”）；
controls.className=“controls”；
cartitem.appendChild（对照组）；
let plus=document.createElement（“span”）；
plus.textContent=“+”；
plus.setAttribute（“数据id”，item.id）；
控制。追加子项（加）；
plus.addEventListener（“单击”，递增购物车）；
让数量=document.createElement（“span”）；
qty.textContent=项目数量；
控件。追加子对象（数量）；
让减号=document.createElement（“span”）；
减.textContent=“-”；
减去.setAttribute（“数据id”，item.id）；
控制。追加子项（减）；
减去.addEventListener（“单击”，递减部分）；
让价格=document.createElement（“div”）；
price.className=“price”；
let cost=新的国际编号格式（“en CA”{
风格：“货币”，
货币：加元
}).格式（项目数量*项目价格）；
price.textContent=成本；
cartitem.appendChild（价格）；
cartSection.appendChild（cartitem）；
});
让total=document.createElement（“div”）；
total.className=“总计”；
//在此处插入“grandTotal”代码。
常量总计=0
total.textContent=grandTotal；
第二节附加物（总计）；
}
showCart（）

---

您可以在foreach之外使用一个变量，并将每个项目的成本添加到该变量中

您修改的代码：（commnets中的信息）

函数showCart（）{
让cartSection=document.getElementById（“cart”）；
cartSection.innerHTML=“”；
设s=购物车分拣（“数量”）；
//foreach之外的grandTotal变量
设grandTotal=0；
s、 forEach（项目=>{
让cartitem=document.createElement（“div”）；
cartitem.className=“购物车项目”；
让title=document.createElement（“h3”）；
title.textContent=item.title；
title.className=“title”；
cartitem.appendChild（标题）；
let controls=document.createElement（“div”）；
controls.className=“controls”；
cartitem.appendChild（对照组）；
let plus=document.createElement（“span”）；
plus.textContent=“+”；
plus.setAttribute（“数据id”，item.id）；
控制。追加子项（加）；
plus.addEventListener（“单击”，递增购物车）；
让数量=document.createElement（“span”）；
qty.textContent=项目数量；
控件。追加子对象（数量）；
让减号=document.createElement（“span”）；
减.textContent=“-”；
减去.setAttribute（“数据id”，item.id）；
控制。追加子项（减）；
减去.addEventListener（“单击”，递减部分）；
让价格=document.createElement（“div”）；
price.className=“price”；
让成本=新的Intl.NumberFormat（“en-CA”，“style:“currency”，currency:“CAD”}）.format（item.qty*item.itemPrice）；
price.textContent=成本；
cartitem.appendChild（价格）；
cartSection.appendChild（cartitem）；
//将成本加到总成本中
grandTotal+=项目数量*项目价格；
});
让total=document.createElement（“div”）；
total.className=“总计”；
//设置grandTotal的格式或根据需要使用它
控制台日志（总计）；
total.textContent=grandTotal；
第二节附加物（总计）；
}

更改

s.forEach(item => {

到

改变

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

到

---

提示：将您所有的个人价格收集到一个数组中，然后使用reduce函数来计算总的sumI，这是一个代码片段。我不得不从分拣机上取下绳子，你需要为我们提供购物车。别再说了谢谢！！这太完美了！

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);