Javascript 如何使用其他数组更新对象数组

我有上面的数据和数组

const [data , setData] = useState([
{
  id:1,
  name : "Walnuts",
  checked:false
},
{
  id:2,
  name:"cashew nut",
  checked : false,
},
{
  id:3,
  name:"pista",
  checked : false,
},
{
  id:4,
  name : "almond",
  checked:false
},
{
  id:5,
  name:"beans",
  checked : false,
},
{
  id:6,
  name:"banana",
  checked : false,
},
{
  id:7,
  name:"apple",
  checked : false,
},
{
  id:8,
  name:"mango",
  checked : false,
},
{
  id:9,
  name:"potato",
  checked : false,
},
{
  id:10,
  name:"carrot",
  checked : false,
},
])

我有3个单选按钮，像水果、坚果和蔬菜

如果用户选择水果，则应检查水果数组中具有名称的所有水果在对象的数据数组中是否等于true 谁能帮我做这个吗？

你喜欢这样吗

const fruits = ["banana","apple","mango"]
const nuts = ["walnuts","pista","cashew nut"]
const veg = ["beans","carrot","potato"]

你喜欢这样吗

const fruits = ["banana","apple","mango"]
const nuts = ["walnuts","pista","cashew nut"]
const veg = ["beans","carrot","potato"]

---

其中一种方法可能类似于：-

data.filter(item => {
 if(fruits.includes(item.name)){
  item.checked = true;
 }
 return data
})

说明：您正在循环查看

数据

数组中的所有

项

，然后如果您的

数组

（水果、坚果或蔬菜）包含该值，您只需返回一个新的

项目
对象，并将
选中
设置为
真
否则将
选中
设置为
假
。结果数组将是一个新数组，因为您正在使用
.map
，现在可以将其设置为您的状态

虽然这在复杂度为O（数据数组长度*水果数组长度）的情况下性能较差。一个更好的方法可以是设置一个
集合
的
水果
，您可以这样检查：-

function updateData(array)
{
const newData = data.map((item)=>{
 if(array.includes(item.name))
  return {...item,checked:true}
 else 
  return {...item,checked:false};
})
setData(newData);
}

一种更好的方法是更改
数据
数组的现有数据结构，以包含一个或多个属性，如
种类
或
类型
，在此基础上，您只能更改其中一种方法中的
种类/类型
与所选选项匹配的项目可以是：-

data.filter(item => {
 if(fruits.includes(item.name)){
  item.checked = true;
 }
 return data
})

说明：您正在循环查看
数据
数组中的所有
项
，然后如果您的
数组
（水果、坚果或蔬菜）包含该值，您只需返回一个新的
项目
对象，并将
选中
设置为
真
否则将
选中
设置为
假
。结果数组将是一个新数组，因为您正在使用
.map
，现在可以将其设置为您的状态

虽然这在复杂度为O（数据数组长度*水果数组长度）的情况下性能较差。一个更好的方法可以是设置一个
集合
的
水果
，您可以这样检查：-

function updateData(array)
{
const newData = data.map((item)=>{
 if(array.includes(item.name))
  return {...item,checked:true}
 else 
  return {...item,checked:false};
})
setData(newData);
}

一种更好的方法是更改
数据
数组的现有数据结构，以包含一个或多个属性，如
种类
或
类型
，在此基础上，您只能更改
种类/类型
与单选按钮
中的所选选项相匹配的项目建议在数组中添加
类型
，而不是维护多个数组<代码>{id:4，名称：“almond”，选中：false，键入：'nut'}
，然后在类型上添加筛选器尝试筛选数组我建议在数组中添加
类型
，而不是维护多个数组<代码>{id:4，名称：“almond”，选中：false，键入：'nut'}
，然后在类型上添加一个过滤器