时间戳

首页 > 解决方案 > 如何比较两个多维数组并合并为单个数组

javascript - 如何比较两个多维数组并合并为单个数组

问题描述

我正在寻找一种方法来根据课程值比较和组合两个多维对象数组。我可以使用顶级过滤器方法使其工作，但不确定如何确保所有级别与技能深度合并。这是一个例子：

var array1 = [
  {
  "course": "Javascript and protractor",
  "description": "this is test course",
  "levelwithskills": [
    {
      "name": "Beginner",
      "skills": [
        {
          "duration": 45,
          "name": "HTML/CSS/JS",
          "price": 75
        },
        {
          "duration": 45,
          "name": "Data And Flows",
          "price": 75
        },
        {
          "duration": 45,
          "name": "Functions And Objects",
          "price": 75
        },
        {
          "duration": 45,
          "name": "Protractor Project",
          "price": 75
        }
      ]
    },
    {
      "name": "Improver",
      "skills": [
        {
          "duration": 45,
          "name": "Jasmine",
          "price": 90
        },
        {
          "duration": 45,
          "name": "Protractor Methods",
          "price": 90
        },
        {
          "duration": 45,
          "name": "Non Angular App Testing",
          "price": 90
        },
        {
          "duration": 45,
          "name": "Reports",
          "price": 90
        }
      ]
    },
    {
      "name": "Intermediate",
      "skills": [
        {
          "duration": 45,
          "name": "Crossbrowser Config",
          "price": 100
        },
        {
          "duration": 45,
          "name": "Data-Driven",
          "price": 100
        },
        {
          "duration": 45,
          "name": "Gulp-Integration",
          "price": 100
        },
        {
          "duration": 45,
          "name": "User Stories To Test",
          "price": 100
        }
      ]
    }
  ],
  "s3key": "javascsipt.png"
},
{
  "course": "Java and BDD",
  "id": "564e0758-803f-11e9-ba30-01cdbe15a808",
  "levelwithskills": [
    {
      "name": "Beginner",
      "skills": [
        {
          "duration": 45,
          "name": "HTML/CSS/JS",
          "price": 1
        },
        {
          "duration": 45,
          "name": "Data and flows",
          "price": 1
        },
        {
          "duration": 45,
          "name": "OOP",
          "price": 1
        },
        {
          "duration": 45,
          "name": "Libraries",
          "price": 1
        }
      ]
    },
    {
      "name": "Improver",
      "skills": [
        {
          "duration": 45,
          "name": "Selenium Webdriver",
          "price": 90
        },
        {
          "duration": 45,
          "name": "Junit",
          "price": 90
        },
        {
          "duration": 45,
          "name": "Saucelabs",
          "price": 90
        },
        {
          "duration": 45,
          "name": "User Stories To Test",
          "price": 90
        }
      ]
    },
    {
      "name": "Intermediate",
      "skills": [
        {
          "duration": 45,
          "name": "Most Used Methods",
          "price": 100
        },
        {
          "duration": 45,
          "name": "Git",
          "price": 100
        },
        {
          "duration": 45,
          "name": "Gherkin",
          "price": 100
        },
        {
          "duration": 45,
          "name": "Cucumber",
          "price": 100
        }
      ]
    },
    {
      "name": "Semi-Advance",
      "skills": [
        {
          "duration": 45,
          "name": "Maven",
          "price": 110
        },
        {
          "duration": 45,
          "name": "Cucumber Data-driven",
          "price": 11000
        },
        {
          "duration": 45,
          "name": "Jenkins",
          "price": 110
        },
        {
          "duration": 45,
          "name": "Pipeline",
          "price": 110
        }
      ]
    },
    {
      "name": "Advance",
      "skills": [
        {
          "duration": 45,
          "name": "Page Object Model",
          "price": 120
        },
        {
          "duration": 45,
          "name": "Advanced Methods",
          "price": 120
        },
        {
          "duration": 45,
          "name": "Advanced Logic",
          "price": 120
        },
        {
          "duration": 45,
          "name": "Your Own Framework",
          "price": 120
        }
      ]
    },
    {
      "name": "Professional",
      "skills": [
        {
          "duration": 45,
          "name": "Serenit Framework p1",
          "price": 130
        },
        {
          "duration": 45,
          "name": "Serenit Framework p2",
          "price": 130
        },
        {
          "duration": 45,
          "name": "Serenit Framework p3",
          "price": 130
        },
        {
          "duration": 45,
          "name": "Serenit Framework p4",
          "price": 130
        }
      ]
    }
  ],
  "passion": "Tester",
  "s3key": "java.png",
}
];

var array2 = [
{
    "course": "Javascript and protractor",
    "levelwithskills": [
        {
            "name": "Beginner",
            "skills": [
                {
                    "name": "HTML/CSS/JS"
                }
            ]
        }
    ]
}
,
{
    "course": "Java and BDD",
    "levelwithskills": [
        {
            "name": "Beginner",
            "skills": [
                {
                    "name": "HTML/CSS/JS"
                }
            ]
        }
    ]
}
];

const sameData = array1.map(
    obj =>
      array2.map(obj2 => {
        if (obj.course === obj2.course) {
          return {
            ...obj,
            levelwithskills: obj.levelwithskills.map(
              xlvl =>
                obj2.levelwithskills.map(ylvl => {
                  if (xlvl.name === ylvl.name) {
                    return {
                      ...xlvl,
                      skills: xlvl.skills.map(
                        xskill =>
                          ylvl.skills.map(yskill => {
                            if (xskill.name === yskill.name) {
                              return {
                                ...xskill,
                                selected: true
                              };
                            }
                            return xskill;
                          })[0]
                      )
                    };
                  }
                  return xlvl;
                })[0]
            )
          };
        }
      })[0]
  );
  
  console.log(sameData);

我正在寻找类似的东西并将其合并为：

[
  {
  "course": "Javascript and protractor",
  "description": "this is test course",
  "levelwithskills": [
    {
      "name": "Beginner",
      "skills": [
        {
          "duration": 45,
          "name": "HTML/CSS/JS",
          "price": 75,
          "selected": true
        },
        {
          "duration": 45,
          "name": "Data And Flows",
          "price": 75
        },
        {
          "duration": 45,
          "name": "Functions And Objects",
          "price": 75
        },
        {
          "duration": 45,
          "name": "Protractor Project",
          "price": 75
        }
      ]
    },
    {
      "name": "Improver",
      "skills": [
        {
          "duration": 45,
          "name": "Jasmine",
          "price": 90
        },
        {
          "duration": 45,
          "name": "Protractor Methods",
          "price": 90
        },
        {
          "duration": 45,
          "name": "Non Angular App Testing",
          "price": 90
        },
        {
          "duration": 45,
          "name": "Reports",
          "price": 90
        }
      ]
    },
    {
      "name": "Intermediate",
      "skills": [
        {
          "duration": 45,
          "name": "Crossbrowser Config",
          "price": 100
        },
        {
          "duration": 45,
          "name": "Data-Driven",
          "price": 100
        },
        {
          "duration": 45,
          "name": "Gulp-Integration",
          "price": 100
        },
        {
          "duration": 45,
          "name": "User Stories To Test",
          "price": 100
        }
      ]
    }
  ],
  "s3key": "javascsipt.png"
},
{
  "course": "Java and BDD",
  "id": "564e0758-803f-11e9-ba30-01cdbe15a808",
  "levelwithskills": [
    {
      "name": "Beginner",
      "skills": [
        {
          "duration": 45,
          "name": "HTML/CSS/JS",
          "price": 1
          "selected": true
        },
        {
          "duration": 45,
          "name": "Data and flows",
          "price": 1
        },
        {
          "duration": 45,
          "name": "OOP",
          "price": 1
        },
        {
          "duration": 45,
          "name": "Libraries",
          "price": 1
        }
      ]
    },
    {
      "name": "Improver",
      "skills": [
        {
          "duration": 45,
          "name": "Selenium Webdriver",
          "price": 90
        },
        {
          "duration": 45,
          "name": "Junit",
          "price": 90
        },
        {
          "duration": 45,
          "name": "Saucelabs",
          "price": 90
        },
        {
          "duration": 45,
          "name": "User Stories To Test",
          "price": 90
        }
      ]
    },
    {
      "name": "Intermediate",
      "skills": [
        {
          "duration": 45,
          "name": "Most Used Methods",
          "price": 100
        },
        {
          "duration": 45,
          "name": "Git",
          "price": 100
        },
        {
          "duration": 45,
          "name": "Gherkin",
          "price": 100
        },
        {
          "duration": 45,
          "name": "Cucumber",
          "price": 100
        }
      ]
    },
    {
      "name": "Semi-Advance",
      "skills": [
        {
          "duration": 45,
          "name": "Maven",
          "price": 110
        },
        {
          "duration": 45,
          "name": "Cucumber Data-driven",
          "price": 11000
        },
        {
          "duration": 45,
          "name": "Jenkins",
          "price": 110
        },
        {
          "duration": 45,
          "name": "Pipeline",
          "price": 110
        }
      ]
    },
    {
      "name": "Advance",
      "skills": [
        {
          "duration": 45,
          "name": "Page Object Model",
          "price": 120
        },
        {
          "duration": 45,
          "name": "Advanced Methods",
          "price": 120
        },
        {
          "duration": 45,
          "name": "Advanced Logic",
          "price": 120
        },
        {
          "duration": 45,
          "name": "Your Own Framework",
          "price": 120
        }
      ]
    },
    {
      "name": "Professional",
      "skills": [
        {
          "duration": 45,
          "name": "Serenit Framework p1",
          "price": 130
        },
        {
          "duration": 45,
          "name": "Serenit Framework p2",
          "price": 130
        },
        {
          "duration": 45,
          "name": "Serenit Framework p3",
          "price": 130
        },
        {
          "duration": 45,
          "name": "Serenit Framework p4",
          "price": 130
        }
      ]
    }
  ],
  "passion": "Tester",
  "s3key": "java.png",
}
]

标签： javascriptarraysmultidimensional-arrayecmascript-6

解决方案

深度合并对象/数组：

取自 drupal - drupal_array_merge_deep_array并用 JS 重写）

function array_merge_deep_array(arrays) {
  let result = [];
  for (let i in arrays){
    for (let key in arrays[i]){
      const value = arrays[i][key];
      // Renumber integer keys
      if (typeof(key) === 'number') {
        result.push(value);
      }
      else if (result[key] && typeof(result[key]) === 'object' && typeof(value) === 'object') {
        result[key] = array_merge_deep_array([
          result[key],
          value,
        ]);
      }
      else {
        result[key] = value;
      }
    }
  }
  return result;
}

推荐阅读