JavaScript中对对象数组进行递归的forEach。

huangapple go评论89阅读模式
英文:

Javascript forEach an Array of Object recursive

问题

Sure, here is the translated content:

<br>
我需要一些关于如何循环遍历一个包含对象数组的对象的帮助。
<br>
<br>
这是一个示例对象:

const node = {
    documents: [{
        name: "test1"
    }],
    children: [{
        documents: [{
            name: "test2"
        }],
        children: [{
            documents: [{
                name: "test3"
            }],
            children: []
        }]
    }]
};

<br>
我的问题
<br>
我尝试了一些这里的解决方案,但都不太符合我的需求。基本上,我想将文档数组中的每个对象移动到子数组中。
<br>
我已经实现了这一点,但目前只在第一个对象中执行,没有递归...
<br>
我无法在不创建一个类似弗兰肯斯坦的代码的情况下弄清楚它...
<br>
我尝试过的
就像我之前提到的,我使用了

Array.concat()

将文档附加到子项,但只在第一个对象中。
<br>
应该看起来像什么

const node = {
	children: [
  	{
    name: "test1"
    },
    {
    children: [
    	{
      name: "test2"
      },
      {
      children: [
      	{name: "test3"}
      ]
      }
    ]
    }
  ]
};

现在,在每个“深度”中,文档都已被“附加”到子项中。
<br>
这应该对每个子项键(深度)都发生。
<br>
<br>
有没有人愿意帮助我?

<br>
编辑:

我想我的示例不够好。这里有一些实际数据:
<br>

const node = {
    id: 1,
    name: "根节点",
    documents: [
        { name: "文档根1", id: 1234 },
        { name: "文档根2", id: 1235 }
    ],
    children: [
        {
            id: 2,
            name: "子节点1",
            documents: [
                { name: "文档子节点1 1", id: 1236 },
                { name: "文档子节点1 2", id: 1237 }
            ],
            children: [{
                id: 3,
                name: "子子节点1",
                documents: [
                    { name: "文档子子节点1 1", id: 1238 },
                    { name: "文档子子节点1 2", id: 1239 }
                ],
                children: null,
                addTreeNodeDisabled: true,
                addLeafNodeDisabled: true,
                editNodeDisabled: true,
                delNodeDisabled: true,
            }],
            addTreeNodeDisabled: true,
            addLeafNodeDisabled: true,
            editNodeDisabled: true,
            delNodeDisabled: true,
        }
    ],
    addTreeNodeDisabled: true,
    addLeafNodeDisabled: true,
    editNodeDisabled: true,
    delNodeDisabled: true,
};
英文:

<br>
i need some help at looping over an Object with Array of Objects
<br>
<br>
Here is an example Object:

const node = {
    documents: [{
        name: &quot;test1&quot;
    }],
    children: [{
        documents: [{
            name: &quot;test2&quot;
        }],
        children: [{
            documents: [{
                name: &quot;test3&quot;
            }],
            children: []
        }]
    }]
};

<br>
My Problem
<br>
I tried some of the solutions from here but it's not quite what I need. Basically i want to move every object from the documents Array into the childrens Array.
<br>
I already got that but currently its only doing it in the firts Object so not recursive...
<br>
I cant figure it out without creating an Frankenstein-ish code...
<br>
I tried
like i mentioned before i used

Array.concat()

to append documents to children but only in the first Object.
<br>
What it should look like

const node = {
	children: [
  	{
    name: &quot;test1&quot;
    },
    {
    children: [
    	{
      name: &quot;test2&quot;
      },
      {
      children: [
      	{name: &quot;test3&quot;}
      ]
      }
    ]
    }
  ]
};

Now in every "depth" the documents were "appended" to children.
<br>
And that should happen for every children key (depth).
<br>
<br>
Is someone kind enough to help me out?

<br>
EDIT:

I guess my example is not good enough. Here is some actual data:
<br>

      const node = {
        id: 1,
        name: &quot;Root Node&quot;,
        documents: [
          { name: &quot;Doc Root 1&quot;, id: 1234 },
          { name: &quot;Doc Root 2&quot;, id: 1235 }
        ],
        children: [
          {
            id: 2,
            name: &quot;Sub Node Node1&quot;,
            documents: [
              { name: &quot;Doc SubNote 1 1&quot;, id: 1236 },
              { name: &quot;Doc SubNote 1 2&quot;, id: 1237 }
            ],
            children: [{
              id: 3,
              name: &quot;Sub Sub Node Node 1&quot;,
              documents: [
                { name: &quot;Doc SubSubNote 1 1&quot;, id: 1238 },
                { name: &quot;Doc SubSubNote 1 2&quot;, id: 1239 }
              ],
              children: null,
              addTreeNodeDisabled: true,
              addLeafNodeDisabled: true,
              editNodeDisabled: true,
              delNodeDisabled: true,
            }],
            addTreeNodeDisabled: true,
            addLeafNodeDisabled: true,
            editNodeDisabled: true,
            delNodeDisabled: true,
          }
        ],
        addTreeNodeDisabled: true,
        addLeafNodeDisabled: true,
        editNodeDisabled: true,
        delNodeDisabled: true,
      };

答案1

得分: 3

你可以通过再次调用该函数,将文档的副本与子节点连接起来。

var f = ({ documents, children, ...o }) => {
    children = [...(documents || []), ...(children || [])].map(f);
    return children.length
        ? { ...o, children }
        : o;
},
data = { id: 1, name: "根节点", documents: [{ name: "文档根 1", id: 1234 }, { name: "文档根 2", id: 1235 }], children: [{ id: 2, name: "子节点1", documents: [{ name: "文档子节点 1 1", id: 1236 }, { name: "文档子节点 1 2", id: 1237 }], children: [{ id: 3, name: "子子节点1", documents: [{ name: "文档子子节点 1 1", id: 1238 }, { name: "文档子子节点 1 2", id: 1239 }], children: null, addTreeNodeDisabled: true, addLeafNodeDisabled: true, editNodeDisabled: true, delNodeDisabled: true, }], addTreeNodeDisabled: true, addLeafNodeDisabled: true, editNodeDisabled: true, delNodeDisabled: true, }], addTreeNodeDisabled: true, addLeafNodeDisabled: true, editNodeDisabled: true, delNodeDisabled: true },
result = f(data);

console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }
英文:

You could concat a copy of documents with the childrens by calling the function again.

<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-js -->
var f = ({ documents, children, ...o }) => {
children = [...(documents || []), ...(children || [])].map(f);
return children.length
? { ...o, children }
: o;
},
data = { id: 1, name: "Root Node", documents: [{ name: "Doc Root 1", id: 1234 }, { name: "Doc Root 2", id: 1235 }], children: [{ id: 2, name: "Sub Node Node1", documents: [{ name: "Doc SubNote 1 1", id: 1236 }, { name: "Doc SubNote 1 2", id: 1237 }], children: [{ id: 3, name: "Sub Sub Node Node 1", documents: [{ name: "Doc SubSubNote 1 1", id: 1238 }, { name: "Doc SubSubNote 1 2", id: 1239 }], children: null, addTreeNodeDisabled: true, addLeafNodeDisabled: true, editNodeDisabled: true, delNodeDisabled: true, }], addTreeNodeDisabled: true, addLeafNodeDisabled: true, editNodeDisabled: true, delNodeDisabled: true, }], addTreeNodeDisabled: true, addLeafNodeDisabled: true, editNodeDisabled: true, delNodeDisabled: true },
result = f(data);

console.log(result);

<!-- language: lang-css -->
.as-console-wrapper { max-height: 100% !important; top: 0; }
<!-- end snippet -->

答案2

得分: 2

我在这里使用了递归来实现结果。

const node = {"documents":[{"name":"test1"}],"children":[{"documents":[{"name":"test2"}],"children":[{"documents":[{"name":"test3"}],"children":[]}]}]}

const unwrap = (v) => ({...{...v}[0]});

const merge = (node) => ([...node.documents, {children: (unwrap(node.children).hasOwnProperty("children") ? merge(unwrap(node.children)) : node.children) }]);

console.log(merge(node));

如果您需要更多帮助,请随时告诉我。

英文:

I've used recursion here to achieve the results.

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

const node = {&quot;documents&quot;:[{&quot;name&quot;:&quot;test1&quot;}],&quot;children&quot;:[{&quot;documents&quot;:[{&quot;name&quot;:&quot;test2&quot;}],&quot;children&quot;:[{&quot;documents&quot;:[{&quot;name&quot;:&quot;test3&quot;}],&quot;children&quot;:[]}]}]}

const unwrap = (v) =&gt; ({...{...v}[0]});

const merge = (node) =&gt; ([...node.documents, {children: (unwrap(node.children).hasOwnProperty(&quot;children&quot;) ? merge(unwrap(node.children)) : node.children) }]);

console.log(merge(node));

<!-- end snippet -->

huangapple
  • 本文由 发表于 2020年1月6日 21:46:45
  • 转载请务必保留本文链接:https://go.coder-hub.com/59613256.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定