以递归方式从 JavaScript 数组构建 JSON

Question

我想从 http 请求返回的数组中构建一个 JSON 对象，我的实际数组如下所示：[{    Description: "Product"    IsInstanciable: false    IsMasked: false    Name: "ProductBase"    Subclasses: [{      Description: "Product2"      IsInstanciable: false      IsMasked: false      Name: "ProductBase2",      Count: 5,      Subclasses:[]    },    {      Description: "Product3"      IsInstanciable: false      IsMasked: false      Name: "ProductBase3",      Count: 4,      Subclasses:[],    }]},{    Description: "Product4"    IsInstanciable: false    IsMasked: false    Name: "ProductBase4",    Count: '...',    Subclasses: [...]}我想从上面的数组递归创建一个 JSON 对象。它看起来像这样：[  {    name: 'Product',    Count: 9,    children: [      {name: 'Product2'},      {name: 'Product3'},    ]  }, {    name: 'Product4',    children: [      {        name: '...',        Count: 'Sum of Count in all children by level'        children: [          {name: '...'},          {name: '...'},        ]      }    ]  },];这是我在打字稿中的递归函数，但它没有按预期工作。我怎样才能解决这个问题？recursive(data, stack: TreeNode[]) {    let elt: TreeNode = {name:'', children: []}    if(data.Subclasses.length > 0) {      elt.name = data.Description;      data.Subclasses.forEach(element => {        elt.children.push({name: element.Description});        this.recursive(element, stack);      });    }else {      elt.name = data.Description;    }    stack.push(elt);  }

Answer 1

您可以将 map 函数与递归函数一起使用，如下所示：

function MapObject(object) {

  if(!object || object.length < 0) return [];

  return object.map(obj => { return {

      name: obj.Description,

      children: MapObject(obj.Subclasses)

  }});

}

遵循完整的工作示例：

var example = [{

    Description: "Product",

    IsInstanciable: false,

    IsMasked: false,

    Name: "ProductBase",

    Subclasses: [{

      Description: "Product2",

      IsInstanciable: false,

      IsMasked: false,

      Name: "ProductBase2",

      Subclasses:[]

    },

    {

      Description: "Product3",

      IsInstanciable: false,

      IsMasked: false,

      Name: "ProductBase3",

      Subclasses:[]

    }]

},

{

    Description: "Product4",

    IsInstanciable: false,

    IsMasked: false,

    Name: "ProductBase4"

}]

function MapObject(object) {

  if(!object || object.length < 0) return [];

  

  return object.map(obj => { return {

      name: obj.Description,

      children: MapObject(obj.Subclasses)

  }});

}

console.log(MapObject(example));

Answer 2

我会将其分解为几个具有明确职责的独立功能：

const sum = (ns) => 

  ns .reduce ((a, b) => a + Number (b), 0)

const getCount = (product) => 

  (product .Count || 0) + sum ((product .Subclasses || []) .map (getCount))

const extract = (product) => 

  ({

    name: product .Name,

    count: getCount (product),

    children: product .Subclasses .map (extract)

  })

const extractAll = (products) => 

  products .map (extract)

const products = [{"Description": "Product", "IsInstanciable": false, "IsMasked": false, "Name": "ProductBase", "Subclasses": [{"Count": 5, "Description": "Product2", "IsInstanciable": false, "IsMasked": false, "Name": "ProductBase2", "Subclasses": []}, {"Count": 4, "Description": "Product3", "IsInstanciable": false, "IsMasked": false, "Name": "ProductBase3", "Subclasses": []}]}, {"Count": 3, "Description": "Product4", "IsInstanciable": false, "IsMasked": false, "Name": "ProductBase4", "Subclasses": []}]

console .log (

  extractAll (products)

)

（请注意，我更改了 outputcount属性的大小写。它似乎更符合name和children。）

我们通过对象递归获取它的Count属性，我们单独递归获取对象的其余部分。虽然可能有一种方法可以将这些结合起来，但我预计代码会更加复杂。

请注意，我假设所有Count属性实际上都是数字，尽管上面的示例包含一个字符串。如果您确实有类似 的值"3"，则getCount需要更复杂一些。