react recursive rendering

recursive-rendering.js

import React from 'react'

const Node = ({ data }) => {
  if (data instanceof Array)
    return <ol>{ data.map(i => <Node data={ data[i - 1] } key={ i } />) }</ol>
  else if (data instanceof Object)
    return <ul>{ Object.keys(data).map(i =><Node data={ data[i] } key={ i } />) }</ul>
  else
    return <li>{ data }</li>
}

const data = {
  a: {
    aa: 1,
    ab: 2,
    ac: 3
  },
  b: {
    ba: {
      baa: 1,
      bab: 2
    },
    bb: [1, 2, 3]
  },
  c: [1, 2, 3, 4],
  d: 1
}

export const Usage = () => <Node data={ data } />