How do I “flatten” an object into an array of arrays

Question

I have this object:

{
  "value": "face",
  "next": [
  {
    "value": "tace",
    "next": [
      {
        "value": "tale",
        "next": [
          {
            "value": "talk",
            "next": []
          }
        ]
      },
      {
        "value": "tack",
        "next": [
          {
            "value": "talk",
            "next": []
          }
        ]
      }
    ]
  },
  {
    "value": "fack",
    "next": [
      {
        "value": "tack",
        "next": [
          {
            "value": "talk",
            "next": []
          }
        ]
      },
      {
        "value": "falk",
        "next": [
          {
            "value": "talk",
            "next": []
          }
        ]
      }
    ]
  }
]
}

What is the best way to iterate over it and create this array of arrays:

[
    ["face", "tace", "tale", "talk"],
    ["face", "tace", "tack", "talk"],
    ["face", "fack", "tack", "talk"],
    ["face" ,"fack", "falk", "talk"]
]

I basically want to "flatten" the object into the array format by traversing down each branch of the object and producing an array of strings for each branch.

Answer 1

You can do this by creating recursive function using reduce method, that will store previous values and when there is no elements in next property it will current copy push to result array.

 const data = {"value":"face","next":[{"value":"tace","next":[{"value":"tale","next":[{"value":"talk","next":[]}]},{"value":"tack","next":[{"value":"talk","next":[]}]}]},{"value":"fack","next":[{"value":"tack","next":[{"value":"talk","next":[]}]},{"value":"falk","next":[{"value":"talk","next":[]}]}]}]} const flatten = (obj, prev = []) => { const next = prev.concat(obj.value) return obj.next.reduce((r, e) => { if(e.next.length) r.push(...flatten(e, next)) else r.push(next.slice().concat(e.value)); return r; }, []) } const result = flatten(data); console.log(result);

Answer 2

You could use an independent recursive function and collect the last item and build an arrayof the given values for every level.

 const flat = (value, next) => next.reduce((r, { value, next }) => { if (next.length) r.push(...flat(value, next)); else r.push([value]); return r; }, []).map(q => [value, ...q]); var data = { value: "face", next: [{ value: "tace", next: [{ value: "tale", next: [{ value: "talk", next: [] }] }, { value: "tack", next: [{ value: "talk", next: [] }] }] }, { value: "fack", next: [{ value: "tack", next: [{ value: "talk", next: [] }] }, { value: "falk", next: [{ value: "talk", next: [] }] }] }] }, result = flat(data.value, data.next); console.log(result);

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

Answer 3

You can use recursion with Array.forEach() to iterate the next property, and add the previous items. When next is empty, take everything, flatten, and push to the result:

 const flatAll = (data) => { const result = []; const fn = ({ value, next }, prev = []) => { if(next.length) next.forEach(o => fn(o, [prev, value])); else result.push([prev, value].flat(Infinity)); }; fn(data); return result; } const data = {"value":"face","next":[{"value":"tace","next":[{"value":"tale","next":[{"value":"talk","next":[]}]},{"value":"tack","next":[{"value":"talk","next":[]}]}]},{"value":"fack","next":[{"value":"tack","next":[{"value":"talk","next":[]}]},{"value":"falk","next":[{"value":"talk","next":[]}]}]}]}; const result = flatAll(data); console.log(result);