Flat nested object array with one property extracted in TypeScript

Question

Considering i got a such code:

type RouteConfig = {
  path: string;
  text: string;
  routes?: RouteConfig[];
};

const routes: RouteConfig[] = [
  {
    path: "/",
    text: "home"
  },
  {
    path: "/user",
    text: "user",
    routes: [
      {
        path: "/user/info",
        text: "user info"
      },
      {
        path: "/user/books",
        text: "user books"
      }
    ]
  }
];

const routeEntries = ["/", "/user", "/user/info", "/user/books"]; // ?? how to get it Programmatically instead of hard coding.

The routes is a tree-like nested object array, each node might contains sub routes node.

The question is simple, how do i get routeEntries based on existed routes defined above?

Orelsanpls · Accepted Answer · 2021-02-09 08:59:13Z

1

You can create a recursive function that will gather every path value, like :

Playground

type RouteConfig = {
  path: string;
  text: string;
  routes?: RouteConfig[];
};

const routes: RouteConfig[] = [
  {
    path: '/',
    text: 'home',
  },
  {
    path: '/user',
    text: 'user',
    routes: [
      {
        path: '/user/info',
        text: 'user info',
      },
      {
        path: '/user/books',
        text: 'user books',
      },
    ],
  },
];

function extractPath(data: RouteConfig[]) {
  return data.reduce((tmp: string[], x) => {
    if (typeof x.routes !== 'undefined') {
      tmp = [
        ...tmp,
        ...extractPath(x.routes),
      ];
    }

    tmp.push(x.path);

    return tmp;
  }, []);
}

const routeEntries = extractPath(routes);

console.log(routeEntries);

answered Feb 9, 2021 at 8:59

Orelsanpls

23.7k7 gold badges46 silver badges74 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Flat nested object array with one property extracted in TypeScript

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related