Issue encountered while implementing a recursive type within a function

I've created a type that recursively extracts indices from nested objects and organizes them into a flat, strongly-typed tuple as shown below:

type NestedRecord = Record<string, any>

type RecursiveGetIndex<
  TRecord extends NestedRecord,
  TPreviousIndices extends any[] = []
> = {
  [K in keyof TRecord]: TRecord[K] extends NestedRecord
    ? RecursiveGetIndex<
        TRecord[K],
        AppendToTuple<TPreviousIndices,K>
      >
    : AppendToTuple<TPreviousIndices, K>
}[keyof TRecord]

type AppendToTuple<T extends any[], U> = [...T, U] 

It functions properly when used with a specific instantiation of a nested object type, for example:

type AnIndex = RecursiveGetIndex<{ foo: { bar: { baz: number}}}> 

Essentially, AnIndex is correctly typed as

["foo", "bar", "baz"]

However, I encounter a recursion error when attempting to employ the recursive type within a function:

function doSomething<T extends NestedRecord>(arg:T){
    type Nested = RecursiveGetIndex<T>
    const doMore = (n: Nested) => {
        console.log(n) //Type instantiation is excessively deep and possibly nested
    }
}

This issue arises because TypeScript cannot predict how deeply the type T might recurse.

Is it correct to assume this? Why doesn't TypeScript defer evaluation until after doSomething is instantiated?

Furthermore, is there a way to prevent this error if I know beforehand that the arg provided to the function will never surpass the TS recursion limit (which is typically 50)? Can I communicate this to TypeScript somehow?

I have seen solutions that restrict recursion by employing a decrementing array type, such as demonstrated in this Stack Overflow answer. Is this the optimal approach in this situation?

Playground with the code.

Updated

Following captain-yossarian's advice, the following modification works:

type RecursiveGetIndex<
  TRecord extends NestedRecord,
  TPreviousIndices extends any[] = [],
  TDepth extends number = 5
> = 10 extends TPreviousIndices["length"] ? TPreviousIndices : {
  [K in keyof TRecord]: TRecord[K] extends NestedRecord
    ? RecursiveGetIndex<
        TRecord[K],
        AppendToTuple<TPreviousIndices,K>
      >
    : AppendToTuple<TPreviousIndices, K>
}[keyof TRecord]

However, the error persists if this number exceeds 10. I assumed it should be set to 50. Could my type be more recursive than I realize?

Updated playground.

Answer №1

RecursiveGetIndex<NestedRecord>
is presenting a significant challenge, primarily due to the behavior of any within a conditional type.

The reason for this complexity lies in the fact that since your generic is specifically assigned to NestedRecord, TypeScript must attempt to apply RecursiveGetIndex to the constraint inside the function for effective type checking. This means that TRecord[K] ends up being interpreted as any, causing the condition TRecord[K] extends NestedRecord to evaluate both branches. Consequently, one branch leads to a repeated invocation of RecursiveGetIndex.

In its original implementation, when TRecord=any, it continuously delves deep into nested keys indefinitely. In order to prevent getting trapped in endless recursion, you can introduce a check for any and resolve it simply to ...any[] under such circumstances. Refer to this playground link for a practical demonstration.

type NestedRecord = Record<string, any>

type RecursiveGetIndex<
  TRecord extends NestedRecord,
  TPreviousIndices extends any[] = []
> = {
   // initial verification for any with 0 extends <certainly not 0> to avoid unnecessary recursion and opt for just any nested keys
   // alternatively use ...unknown[] for a safer approach.
  [K in keyof TRecord]: 0 extends TRecord[K]&1 ? [...TPreviousIndices, K, ...any[]] 
  : TRecord[K] extends NestedRecord
    ? RecursiveGetIndex<
        TRecord[K],
        AppendToTuple<TPreviousIndices,K>
      >
    : AppendToTuple<TPreviousIndices, K>
}[keyof TRecord]


type AppendToTuple<T extends any[], U> = [...T, U] 

type AnIndex = RecursiveGetIndex<{ foo: { bar: number, baz: any}}> 
// output: ["foo", "bar"] | ["foo", "baz", ...any[]]

function doSomething<T extends NestedRecord>(arg:T){
    type Nested = RecursiveGetIndex<T>
    const doMore = (n: Nested) => {
        console.log(n) //here n will work a lot like unknown
    }
}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Utilize TypeScript File array within the image tag in HTML with Angular 2

I am in the process of developing a web application that allows users to upload CSV data and images, which are then displayed on the application. However, I have encountered an issue where I am unable to display the imported images. The images are imported ...

What sets TypeScript apart from AtScript?

From what I understand, TypeScript was created by Microsoft and is used to dynamically generate JavaScript. I'm curious about the distinctions between TypeScript and AtScript. Which one would be more beneficial for a JavaScript developer to learn? ...

Switch the Follow/Following button depending on the user's current follow status with the individual

I am currently working on a functionality to toggle between the Follow and Following buttons based on whether the current user is following another individual. I have implemented an NgIF statement in my code, but I am facing challenges in properly checking ...

Is using $timeout still considered the most efficient method for waiting on an Angular directive template to load?

When it comes to waiting for a directive's template to render, our team has been following the approach of enclosing our DOM manipulation code in a $timeout within the directive's link function. This method was commonly used in the past, but I&ap ...

In what situations might a finally block fail to execute?

Are there any circumstances where the code in a finally block may not be reached, aside from the usual suspects like process exit(), termination signal, or hardware failures? In this TypeScript code snippet that usually runs smoothly in node.js, occasiona ...

One potential solution for fixing the error in GetRepository of TypeORM is to check for undefined properties before attempting to access them. This error typically occurs when trying to read properties of an undefined

[Nest] 171 - 08/31/2022, 8:35:42 PM ERROR [ExceptionHandler] Cannot read properties of undefined (reading 'getRepository') tenant-node | TypeError: Cannot read properties of undefined (reading 'getRepository') tenant-node | at Instance ...

Differences between Object and Typecasted Literal Object in TypeScript

I'm currently grappling with the decision of whether to use an interface or a class in my TypeScript code. Coming from a background in C#, I find the strictness of classes appealing, but there is also a certain allure to the flexibility offered by int ...

Disabling the use of console.log() in a live environment

In an effort to disable console logs for production environments in my angular application, I implemented the code below. While it successfully suppresses logs in Chrome, IE 11 continues to display them. Here is the snippet from main.ts: if (environment. ...

Is there a way to verify in Angular whether an image link has a width and height exceeding 1000?

I'm currently working on a function that checks if an image linked in an input field has a width and height greater than 1000 pixels, and is in JPG format. Here's my approach: HTML: <input (change)="checkValidImage(1, product.main_photo)" [ ...

Building a NestJS/Prisma RESTful API to retrieve data from a related field

I am diving into creating my very own Rest API using Nestjs and Prisma for the first time. This project is a basic representation of an inventory management system, keeping things simple with shelves and boxes to store items. The structure in place has tab ...

Issue with auto formatting quotes in IntelliJ / WebStorm is no longer functioning as expected

Currently, my TSLint configuration is set to permit the use of single quotes (') instead of double ones ("). Previously, I was able to conveniently switch all instances of " to ' in a file by using the Reformat Code shortcut CTRL + ALT ...

"Having trouble subscribing? The first attempt doesn't seem to be working

I'm currently working on some TypeScript code that searches for the nearest point around a user in need of car assistance by checking a database. Once the nearest point is identified, the code retrieves the phone number associated with it and initiate ...

Enforce boundaries by constraining the marker within a specified polygon on a leaflet map

Currently, I am utilizing a leaflet map to track the user's location. The map includes a marker for the user and a polygon shape. My goal is to ensure that the user marker always stays within the boundaries of the defined polygon. In case the user mov ...

Monaco Editor in TypeScript failing to offer autocomplete suggestions

When using a union type as a parameter of a function in Monaco Editor, the suggestions do not appear. However, in VS Code, the suggestions are provided. Is there a setting I need to enable in Monaco to have the same functionality? Although Monaco provides ...

What is the correct way to forcefully override an existing type in TypeScript?

As I work with Formik, a React form library, I find myself creating custom fields and utilizing the generic Schema type provided by Formik. This type represents the values object, which holds all the values for each field in the form. One of the custom co ...

Give it a little time before uploading a widget onto the page

As a newcomer to programming, I recently came across this code from an open source project. I am in the process of loading a widget onto a website. Instead of having the widget load instantly, I would like it to wait 10 seconds before displaying. Below i ...

An issue with the validation service has been identified, specifically concerning the default value of null in

Using Angular 10 and Password Validator Service static password(control: AbstractControl) { // {6,100} - Check if password is between 6 and 100 characters // (?=.*[0-9]) - Ensure at least one number is present in the strin ...

What are the different types of class properties in TypeScript?

Currently, I am incorporating ES6 classes in typescript using the following code snippet: class Camera { constructor(ip) { this.ip = ip; } } Despite encountering an error message, it appears that the code still compiles successfully. The ...

Create a randomized item for experimentation in NodeJs using an interface

Looking for a NodeJs package that can generate fake data in all required fields of a complex object described by a set of typescript interfaces, including arrays and sub-interfaces. Any recommendations? ...

Errors occur with Metro bundler while utilizing module-resolver

Recently, I completed a project using the expo typescript template that runs on both iOS and Android platforms, excluding web. To enhance my development process, I established path aliases in the tsconfig.json file as shown below: "paths": { "@models/ ...