如何递归遍历数组并替换某些值？[重复]

Question

我试图解析一个JSON结构，json结构看起来像这样：

{
    children: [
        {
            type: "p",
            children: [{
                text: ""
            }]
        },
        {
            type: "social_embed",
            children: [{
                text: ""
            }]
            source_url: "some_url"
        },
        {
            type: "p",
            children: [{
                type: "p",
                children: [{
                    type: "p",
                    children: [{
                        text: ""
                    }]
                }]
            }]
        },
    ]
}

输出将看起来像：

{
    children: [
        {
            type: "p",
            children: [{
                text: ""
            }]
        },
        {
            type: "p",
            children: [{
                text: "some_url"
            }]
        },
        {
            type: "p",
            children: [{
                type: "p",
                children: [{
                    type: "p",
                    children: [{
                        text: ""
                    }]
                }]
            }]
        },
    ]
}

这是我正在尝试的代码：

 if (currentBlock.type == "card" || currentBlock.type =="card_body") 
       {
          parsedBlocks.map((block: any, index: any) => {
            block.children = parseBlocks(block.children)
          })

          console.log("Blocks after parsing", parsedBlocks)

          editor.insertFragment(parsedBlocks);
          return true
        }

        const parseBlocks = (blocks: any): any => {

        blocks.forEach((block: any) => {
          console.log("Block ", block)
          if (block.type == "social_embed") {
            const newBlock = {
                type: "p",
                children: [
                  {
                    text: block.source_url
                  }
                ]
              }
              blocks[blocks.indexOf(block)] = newBlock
          }
          if (block.children) {
            return parseBlocks(block.children)
          }
        })
        return blocks
      }

我希望递归遍历所有子对象，直到对象中没有children属性，当我遇到类型为“social_embed”的对象时，我希望将其替换为类型：“p”，并将文本作为源url并修改整个数组，子项可以有无限嵌套，但社交嵌入在其子项中除了{text:“}之外不能有任何内容

Answer 1

您可以执行一个递归函数，该函数在树上循环，并在树遇到社交嵌入时就地修改

const input = {children: [{type: "p",children: [{text: ""}]},{type: "social_embed",children: [{text: ""}], source_url: "some_url"},{type: "p",children: [{type: "p",children: [{type: "p",children: [{text: ""}]}]}]}]}

function rec(input) {
    if (input.type === "social_embed") {
        input.children = [{text: input.source_url}]
        input.type = "p"
        delete input.source_url
    }
    input.children?.forEach(rec)
}
rec(input)

console.log(JSON.stringify(input, null, 4))

css prettyprint-override">.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 2

这样的东西怎么样：

const parse = node => {
  if (node.type === "social_embed") {
    return {
      type: "p",
      children: [{ text: node.source_url}]
    }
  }

  return node.children ? {
    ...node,
    children: node.children.map(parse)
  } : node;
}

https://replit.com/@jamiedixon/ParseTree#索引。js

如果您想更进一步，您可以根据type定义节点的访问者，并以这种方式处理它们。

const socialEmbed = node => ({
  type: "p",
  children: [{ text: node.source_url }]
})

const visitors = {
  "social_embed": [socialEmbed]
}

const parse = node => {
  const _visitors = visitors[node.type] || [x => x];
  const result = _visitors.reduce((agg, fn) =>  fn(agg), node);

  return result.children ? {
    ...result,
    children: result.children.map(parse)
  } : result;
}

https://replit.com/@jamiedixon/ParseTree#visitors.js

Answer 3

您可以将新对象映射到子对象，并从旧对象中选择一个新对象。

js lang-js prettyprint-override">const
    update = ({ children = [], ...object }) => {
        if (object.type === "social_embed") {
            const
                type= 'p',
                text = object.source_url;
            return { type, children: [{ text }] };
        }
        children = children.map(update);
        return children.length
            ? { ...object, children }
            : object;
    },
    tree = { children: [{ type: "p", children: [{ text: "" }] }, { type: "social_embed", children: [{ text: "" }], source_url: "some_url" }, { type: "p", children: [{ type: "p", children: [{ type: "p", children: [{ text: "" }] }] }] }] };

tree.children = tree.children.map(update);

console.log(tree);

.as-console-wrapper { max-height: 100% !important; top: 0; }