javascript - 将项目移动到嵌套数组中的任意位置

Question

我已成功将预期对象复制到预期位置(我的代码如下)，但如何移动它？所以它不会再存在于原来的位置。

因此，在我的示例中，我想获取 id 为 14 的对象(对象的最底部)并将其移动到 id 为对象的子对象中3(朝向顶部)。

我知道我需要修改我的 moveItem 函数中的这一行: item.children.push(itemToMove) ，但出于某种原因我想不出它。

对于非常大/嵌套的对象也感到抱歉，我想确保覆盖一个深层嵌套的对象。

const myObj = [
  {
    id: 1,
    name: '1',
    children: [
      {
        id: 2,
        name: '2',
        children: [
          {
            id: 3,
            name: '3',
            children: []
          }
        ]
      },
      {
        id: 4,
        name: '4',
        children: [
          {
            id: 5,
            name: '5',
            children: [
              {
                id: 6,
                name: '6',
                children: [
                  {
                    id: 7,
                    name: '7',
                    children: []
                  }
                ]
              }
            ]
          }
        ]
      },
    ]
  },
    {
    id: 8,
    name: '8',
    children: [
      {
        id: 9,
        name: '9',
        children: [
          {
            id: 10,
            name: '10',
            children: []
          }
        ]
      },
      {
        id: 11,
        name: '11',
        children: [
          {
            id: 12,
            name: '12',
            children: [
              {
                id: 13,
                name: '13',
                children: [
                  {
                    id: 14,
                    name: '14',
                    children: []
                  }
                ]
              }
            ]
          }
        ]
      },
    ]
  }
]

let itemToMove = {
  id: 14,
  name: '14',
  children: []
}

// move item, return updated obj
function moveItem(itemToMove, obj, parentId) {

  for (let i=0;i<obj.length;i++) {
    const value = obj[i];
    const item = search(obj[i], parentId);
    if (item) {
      item.children.push(itemToMove); // pushed into children, but need to move not duplicate in
      break;
    }
  }

  function search(obj, id) {
    if (obj.id === id) {
      return obj;
    }

    for (let i=0;i<obj.children.length;i++) {
      const possibleResult = search(obj.children[i], id);
        if (possibleResult) {
          return possibleResult;
        }
    }
  }

  return obj;
};

console.log(moveItem(itemToMove, myObj, 3))

Answer 1

我可能会做这样的事情，考虑到如果插入失败，您应该有某种方法来重新设置数据。我也使用了 ES6，它与你的代码不同，但它给了你一些想法。

let parent
function removeItem (obj, itemToFind) {
	// Loop the object
  obj.find((e, index) => {
		// If the id's match remove from the parent if it exists otherwise from the object as its at root level
    if (e.id === itemToFind.id) {
      if (parent) {
        parent.children.splice(index, 1)
      } else {
        obj.splice(index, 1)
      }
			// break the loop once returned true. Change find to forEach to remove all instances with id if allowing multiples
      return true
    }
		// recurse
    else if (e.children && e.children.length > 0) {
      parent = e
      return removeItem(e.children, itemToFind)
    }
  })
}
// move item, return updated obj
function moveItem (itemToMove, obj, parentId) {
  for (let i = 0; i < obj.length; i++) {
    const value = obj[i]
    const item = search(obj[i], parentId)
    if (item) {
      item.children.push(itemToMove) // pushed into children, but need to move not duplicate in
      break
    }
  }

  function search (obj, id) {
    if (obj.id === id) {
      return obj
    }

    for (let i = 0; i < obj.children.length; i++) {
      const possibleResult = search(obj.children[i], id)
      if (possibleResult) {
        return possibleResult
      }
    }
  }

  return obj
};
removeItem(myObj, itemToMove)
moveItem(itemToMove, myObj, 3)