如何计算和添加对象中关键点的值

Question

我需要编写一个包含两个参数的函数，第一个参数是

例子：

<ul>
    <li>oreos<li/>
    <li>milk<li/>
<ul/>

let products = {
    oreos: 20,
    milk:  17,
    bread: 12,
    doritos: 10
}

我尝试使用for in/of循环来遍历产品对象，并将其与相匹配。




Answer 1

循环使用li元素，使用它们的innerText作为查找价格的关键，对它们进行求和，你就好了：

let total = 0;
document.querySelectorAll('li').forEach(item => {
  total += products[item.innerText];
});

还有其他形式，您可以添加一些内容（比如首先检查产品数组中是否存在该项），但这是基本思想。

Answer 2

你的函数可能是这样的：

1. 迭代所有列表项
2. 获取项目的文本内容
3. 使用文本内容作为键在products对象中查找价格
4. 添加到总数中
5. 返回总数

我使用了数组。from（）和数组。原型reduce（）一次完成这一切。当然，您需要一个独特的类，或者更好的列表ID，而不是简单地选择页面上的所有列表项。

let products = {
    oreos: 20,
    milk:  17,
    bread: 12,
    doritos: 10
}

function getTotal(listElements, productPrices) {
  var total = Array.from(listElements).reduce(function(total, listItem) {
    total += productPrices[listItem.textContent] || 0;
    return total;
  }, 0);
  return total;
}

console.log(getTotal(document.querySelectorAll('li'), products));

<ul>
    <li>oreos</li>
    <li>milk</li>
</ul>

Answer 3

您可以做的是，您可以使用以下功能：

let totalPrice = (priceList, products) => {
return products.reduce((total, elem) => {
    total += priceList[elem.innerText];
    return total;
}, 0)

}

此函数使用Array.reduce迭代产品列表，并添加产品价格列表并返回总数。

您应该签出数组。reduce（）更清晰。