js/es6 多级树形数组重组优化

Question

数组结构为

this.data[i].col[i].col[i].data[i].rules[i]

我需要把最后rules[i]里的内容放到上面一层data[i]里

反过来，我也能把data[i]里的东西放进rules[i]里面

在这里先感谢各位大神们的解答，小弟感激不尽！

Answer 1

不知道这样是不是你想要的：

function crisscross(list) {
  list.forEach((item, index) => {
    if (item[index]) {
      // 子元素内容合并至父元素
      Object.assign(item, item[index])
      // 父元素内容合并至子元素
      Object.assign(item[index], item)
    }
  })
}

因为我比较好奇，rules 是一个数组，rules[i].data 也是一个数组，里面有很多个 data 元素，你是只需要将子元素 (数组) 中与父元素的索引相同的位置的元素 (data[i]) 合并至父元素中吗？

Answer 2

想把下一层数组展开，用 flatMap；
想把下一层数组每个元素合并当前层的其他属性，用 map() + spread 运算 {...currentLevelOtherProps, ...nextLevelElement}
用解构可以拆分对象的某些属性和其他属性：const { rules, ...rest } = obj，解构可以用于参数。

组合起来就是下面这样：

// this.data[i].col[i].col[i].data[i].rules[i]
const dealLevel = this.data[i].col[i].col[i];
dealLevel.data = dealLevel.data
    .flatMap(({ rules, ...rest }) => rules.map(rule => ({ ...rest, ...rule })));