Javascript 从对象中删除深项目

我希望删除

recipeStep

所在的封装对象，该对象等于

heat

。因此，

recipeMealSteps

中的第一个数组项将被删除，因为它包含

热量

。我尝试过使用

.map

和

.filter

，但是我没有得到减去

热

步骤的整个对象

以下是迄今为止我所得到的失败之处：

let filteredRecipes = meals.map((m) =>
  m.mealTypeRecipes.map((r) => r.recipeMealSteps.filter((s) => s.recipeStep !== 'heat'))
);

 let meals = [
      {
        "mealId":0,
        "mealDescription": "Favourties",
        "mealTypeRecipes": [
          {
            "recipeAuthor": "Frank Doe",
            "recipeDescription": "Great chicken dish for those that don't eat chicken",
            "recipeID": 0,
            "recipeMealSteps": [
              {
                "recipeDesc": "Heat up the oven",
                "recipeStep": "heat"
              },
              {
                "recipeDesc": "Allow it to cook",
                "recipeStep": "cool"
              },
              {
                "recipeDesc": "Take it out the oven",
                "recipeStep": "out"
              }
            ]
          },{
            "recipeID": 1,
            "recipeName": "Fish Dish",
            "recipeMealSteps": [
              {
                "recipeDesc": "Heat up the oven",
                "recipeStep": "heat"
              },
              {
                "recipeDesc": "Allow it to cook",
                "recipeStep": "cool"
              },
              {
                "recipeDesc": "Take it out the oven",
                "recipeStep": "out"
              }
            ]
          }]
      }
    ]
        

编辑：

说明：在第一个映射中，我们获取每个餐项作为回调函数的参数。我们解构它，使“m”是一个具有所有属性“mealTypeRecipes”的对象（在本例中，m具有属性“meadId”和“mealDescription”）。另一方面，我们在变量'mealtypeprecipes'中输入属性'mealtypeprecipes'的值。这要归功于排列运算符“…”。这相当于

let filteredRecipes = meals.map((mealItem) => {
    const {mealTypeRecipes, ...m} = mealItem 

然后，我们返回重建对象，返回属性“mealTypeRecipes”的新值，并将其与未修改的对象部分“…m”放在一起。这将创建旧对象的副本，以确保不变性

更详细的方法是这样做的

let filteredRecipes = meals.map((meal) => {
  const {mealTypeRecipes, ...m} = meal;
  return {
    ...m,
     mealTypeRecipes: mealTypeRecipes.map((mealTypeRecipeItem) => {
       const {recipeMealSteps,...r} = mealTypeRecipeItem;
       return {
          ...r,
          recipeMealSteps: recipeMealSteps.filter((s) => s.recipeStep !== 'heat')    
       }
     })
    }
 });

编辑：

说明：在第一个映射中，我们获取每个餐项作为回调函数的参数。我们解构它，使“m”是一个具有所有属性“mealTypeRecipes”的对象（在本例中，m具有属性“meadId”和“mealDescription”）。另一方面，我们在变量'mealtypeprecipes'中输入属性'mealtypeprecipes'的值。这要归功于排列运算符“…”。这相当于

let filteredRecipes = meals.map((mealItem) => {
    const {mealTypeRecipes, ...m} = mealItem 

然后，我们返回重建对象，返回属性“mealTypeRecipes”的新值，并将其与未修改的对象部分“…m”放在一起。这将创建旧对象的副本，以确保不变性

更详细的方法是这样做的

let filteredRecipes = meals.map((meal) => {
  const {mealTypeRecipes, ...m} = meal;
  return {
    ...m,
     mealTypeRecipes: mealTypeRecipes.map((mealTypeRecipeItem) => {
       const {recipeMealSteps,...r} = mealTypeRecipeItem;
       return {
          ...r,
          recipeMealSteps: recipeMealSteps.filter((s) => s.recipeStep !== 'heat')    
       }
     })
    }
 });

---

所以你想删除每一个等于“热”的配方步骤，对吗？没错，是的。所以你想删除每一个等于“热”的配方步骤，对吗？没错，是的，我尝试了一些与spread操作符大致相似的操作，试图将返回的数组与原始数组合并，但我不太了解发生了什么，无法得出正确的结论。所以，谢谢你-这很有效！我已经对代码进行了大量的讲解，已经接近理解了，但是有人能准确地解释一下发生了什么吗？@Mint_Saude我在answer@de3谢谢你，我真的很感激你花时间这么做！我尝试了一些与spread操作符大致相似的操作，试图将返回的数组与原始数组合并，但我不太清楚到底发生了什么，无法得出正确的结论。所以，谢谢你-这很有效！我已经对代码进行了大量的讲解，已经接近理解了，但是有人能准确地解释一下发生了什么吗？@Mint_Saude我在answer@de3谢谢你，我真的很感激你花时间这么做！