javascript - unEven 数组，如 concatAll 函数

Question

我有这 2 个数组代表相同的数据:

array1 = [
  {name: "max", age: 30},
  {name: "paul"},
  {name: "paul.Jack", age: 25},
  {name: "max.David"},
  {name: "max.Sylvia", age: 27},
  {name: "paul.Jack.Ned"},
  {name: "paul.Jack.Mike"},
  {name: "max.David.Jeff"},
  {name: "max.Sylvia.Anna", age: 5},
  {name: "max.David.Buffy"},
  {name: "max.Sylvia.Craig"},
  {name: "max.Sylvia.Robin"}
];
array2 = [
    {
      name: "max",
      age: 30,
      children: [
        {
          name: "Sylvia",
          age: 27,
          children: [
            {name: "Anna", age: 5},
            {name: "Craig"},
            {name: "Robin"}
          ]
        },
        {
          name: "David",
          children: [
            {name: "Jeff"},
            {name: "Buffy"}
          ]
        }
      ]
    },
    {
      name: "paul",
      children: [
        {
          name: "Jack",
          age: 25,
          children: [
            {name: "Ned"},
            {name: "Mike"}
          ]
        }
      ]
    }
  ];

我的目标是有一个函数 unEven 将 array1 转换为 array2，我正在使用 lodash 来执行此操作，这就是我现在的位置:
对于 unEven array1 到 array2，在本例中，跟踪属性“name”包含有关该项目应推送到新数组中何处的信息，请检查此 js bin ，这适用于 3 级嵌套数组，但我的目标是使其成为不均匀数组，而不受嵌套级别的限制，这就是我陷入困境的地方。
unEven 函数将类似于 video 中介绍的 concatAll 函数。 .
这是 unEven 函数:

Array.prototype.unEven = function (trackingProperty, children, resultArray) {
  var newItem, prop, index, parent, subParent, subParentIndex;
  resultArray = resultArray || [];
  this.forEach(function (item) {
    newItem = lodash.omit(item, trackingProperty);
    prop    = lodash.pick(item, trackingProperty);
    if (prop[trackingProperty].indexOf('.') === -1) {
      resultArray.push(item);
    } else {
      newItem[trackingProperty] = prop[trackingProperty].split(".");
      parent = {};
      parent[trackingProperty] = newItem[trackingProperty][0];
      index = lodash.indexOf(resultArray, lodash.find(resultArray, parent));
      if (newItem[trackingProperty].length === 2) {
        newItem[trackingProperty] = newItem[trackingProperty][1];
        if (!Array.isArray(resultArray[index][children])) {
          resultArray[index][children] = [];
        }
        resultArray[index][children].push(newItem);
      } else if (newItem[trackingProperty].length === 3) {
        subParent = {};
        subParent[trackingProperty] = newItem[trackingProperty][1];
        subParentIndex = lodash.indexOf(resultArray[index][children], lodash.find(resultArray[index][children], subParent));
        newItem[trackingProperty]   = newItem[trackingProperty][2];
        if (!Array.isArray(resultArray[index][children][subParentIndex][children])) {
          resultArray[index][children][subParentIndex][children] = [];
        }
        resultArray[index][children][subParentIndex][children].push(newItem);
      }
    }
  });
  return resultArray;
};

为了给出我的用例，我正在尝试制作一个 d3js tree layout的angular ui router在我的应用程序中，它将从路由 JSON 文件生成，因为我在 JSON 文件中创建了路由。

Answer 1

这是一个 lodash 重的解决方案，我认为它可以满足您的需求。如果您不关心改变原始数组，您可以跳过克隆；如果您在原始数组中总是在其 parent 之后有 child ，则可以跳过排序。

function unEven(array1) {
     _(_.clone(array1, true)) //begin chaining syntax, with cloned array
    .each(function(person) {
        person.name = person.name.split(".") //replace name with array of names
    })
    .sortBy(function(person) {return person.name.length}) //sort so that we handle children after parents
    .reduce(function(result, person) {
        var parentArray = result;
        var name = person.name.pop() //their actual name is the last one in the list
        _.each(person.name, function(parentName) { //loop through parent names to find the proper array to add to
            var parent = _.find(parentArray, {name: parentName});
            if(!parent) throw new Error(name + " has non-existent parent "+parentName);
            parentArray = parent.children = parent.children || []
        })
        person.name = name; //return name back to just being their name
        parentArray.push(person);
        return result;
    }, []) //reduce ends chaining syntax; so no need for .value
}