Javascript 匹配多个数组

我从多个数组开始。然后，根据复选框选择，我想交叉检查

项目

数组中的值，并从

价格

和

经验

数组中获取相关值

<input type="checkbox" name="grocery" value="peach">
<input type="checkbox" name="grocery" value="apple">
<input type="checkbox" name="grocery" value="orange">

---

我认为使用对象数组的最佳方式

let array = [
    { "item": "peach", "price": 21, "exp": 21, "lot": 6 },
    { "item": "apple", "price": 32, "exp": 18, "lot": 8 },
    { "item": "orange", "price": 18, "exp": 25, "lot": 4 }
]

定义后，您可以添加到

交叉检查

crossCheck.push(array[i])

希望这个解决方案能对您有所帮助。

---

感谢阅读

您不应该将这些值存储在不同的数组中。当代码库增长并且不同的函数想要访问这些值时，依赖数组索引会对您产生不利影响。只需使用一个对象-

{
 "apple": {
       "price":32,
       "lot":8
  }
}

这样，当你想获取苹果的价格和批次时，你只需做

apple.price

或

apple.lot

，无需复杂的迭代或for循环

--编辑1

正在获取选中元素的列表

let inputElements = document.getElementsByName("grocery"); 
let checked = [...inputElements].map(item => { 
  if(item.checked) { 
     return item.value 
  }
}).filter(item => item); 
console.log(checked)

您可以按名称获取所有元素

您可以使用扩展语法将DOM元素列表转换为数组

[…inputElements]

然后迭代该数组，检查“checked”状态，如果为true，则返回值。如果它不是真的，那么您将在该位置得到未定义

然后过滤得到的选中数组以删除“未定义”元素 我鼓励您逐行记录每条语句

之后，检查选择了哪些值，并从

constitems={apple:{price:32，lot:8}}

中提取这些值。如果您只允许检查其中一种水果，那么您几乎可以执行

Items[checked[0]].price

获取价格，而

Items[checked[0]].lot

获取批次

---

如果允许多个选中的输入值，则必须使用map或forEach对所有值进行迭代。

可以使用

数组。reduce

将项目与其各自的字段进行映射，如下所示：， 我假设您的商品名称是唯一的

let items=[“桃子”、“苹果”、“橘子”]；
让价格=[21,32,18]；
设exp=[21,18,25]；
让lot=[6,8,4]；
让交叉检查=[]；
const itemMap=items.reduce（（映射、项、索引）=>{
地图[项目]=[价格[指数]、经验[指数]、批次[指数]；
返回图；
},{});
document.getElementsByName（'screery'）.forEach（（项目，索引）=>{
if（item.type='checkbox'&&item.checked==true）{
交叉检查.推送（项.值）；
}
});
交叉检查.forEach（项目=>{
log（`item}价格为${itemMap[item][0]}`）；
log（${item}exp是${itemMap[item][1]}`）；
log（${item}批为${itemMap[item][2]}`）；
});
要获得预期结果，请使用addEventListener并使用带有leti变量的for循环索引

循环项使用for循环和let获取每个循环索引值
添加带有更改事件的addEventListener
每次检查时，按下交叉检查阵列

let item=[“桃子”、“苹果”、“橘子”]；
让价格=[21,32,18]；
设exp=[21,18,25]；
让lot=[6,8,4]；
让交叉检查=[]；
让items=document.getElementsByName（'screery'）；
for（设i=0；i

桃子
苹果
橙色
有趣。。。所以所有的东西都在一个数组中<代码>让myArray=[{“peach”：{“price”：32，“lot”：8}}，{“apple”：{“price”：21，“lot”：6}}，…]

？准确地说。如果你没有一个大的元素列表，那么我会把它保存在一个单独的对象中，比如

{“apple”：{“price”：32，“lot”：8}，“peach”：{“price”：18，“lot”：7“}}

大约有15个

项目

。目前我为（var i=0；iYou只需通过键获取值。如果您知道要从

const Items={apple:{price:32，lot:8}}

获取苹果的价格和批次，那么您需要

Items.apple

。对于苹果的价格，您需要

Items.apple.price

。这使代码更易于阅读。我现在就试试看。谢谢您的建议。+10

let inputElements = document.getElementsByName("grocery"); 
let checked = [...inputElements].map(item => { 
  if(item.checked) { 
     return item.value 
  }
}).filter(item => item); 
console.log(checked)