Keyof nested child objects

Question

I have a recursively typed object that I want to get the keys of and any child keys of a certain type.

For instance. Below I want to get a union type of:

<         


        

Answer 1

That's a tough one. TypeScript lacks both mapped conditional types and general recursive type definitions, which are both what I'd want to use to give you that union type. (Edit 2019-04-05: conditional types were introduced in TS2.8) There are some sticking points with what you want:

• The nested property of a RouteEntry can sometimes be null, and type expressions that evaluate to keyof null or null[keyof null] start to break things. One needs to be careful. My workaround involves adding a dummy key so that it's never null, and then removing it at the end.
• Whatever type alias you use (call it RouteListNestedKeys) seems to need to be defined in terms of itself, and you will get a "circular reference" error. A workaround would be to provide something that works up to some finite level of nesting (say, 9 levels deep). This might cause the compiler to slow way down, since it could eagerly evaluate all 9 levels instead of deferring the evaluation until later.
• This needs a lot of type alias composition involving mapped types, and there is a bug with composing mapped types that won't be fixed until TypeScript 2.6. A workaround involves using generic default type parameters.
• The "remove a dummy key at the end" step involves a type operation called Diff which needs at least TypeScript 2.4 to run properly.

All that means: I have a solution which works, but I warn you, it's complex and crazy. One last thing before I drop in the code: you need to change

export const list: RouteList = { // ...

to

export const list = { // ...

That is, remove the type annotation from the list variable. If you specify it as RouteList, you are throwing away TypeScript's knowledge of the exact structure of list, and you will get nothing but string as the key type. By leaving off the annotation, you let TypeScript infer the type, and therefore it will remember the entire nested structure.

Okay, here goes:

type EmptyRouteList = {[K in 'remove_this_value']: RouteEntry};
type ValueOf = T[keyof T];
type Diff = ({[K in T]: K} &
  {[K in U]: never} & { [K: string]: never })[T];
type N0 = keyof X
type N1}> = keyof X | ValueOf 
type N2}> = keyof X | ValueOf 
type N3}> = keyof X | ValueOf 
type N4}> = keyof X | ValueOf 
type N5}> = keyof X | ValueOf 
type N6}> = keyof X | ValueOf 
type N7}> = keyof X | ValueOf 
type N8}> = keyof X | ValueOf 
type N9}> = keyof X | ValueOf 
type RouteListNestedKeys,'remove_this_value'>> = Y;

Let's try it out:

export const list = {
    '/parent': {
        name: 'parentTitle',
        nested: {
            '/child': {
                name: 'child',
                nested: null,
            },
        },
    },
    '/another': {
        name: 'anotherTitle',
        nested: null
    },
}

type ListNestedKeys = RouteListNestedKeys 

If you inspect ListNestedKeys you will see that it is "parent" | "another" | "child", as you wanted. It's up to you whether that was worth it or not.

Whew! Hope that helps. Good luck!