Universal key and attribute retrieval function

Question

Universal key and attribute retrieval function

Currently, I am attempting to analyze the characteristics of objects within arrays. In order to maintain type safety, I am utilizing a getter function to access the child object of the array objects (if necessary) that contains the specific property to be observed.

The propertyName / key must be a string since the observe library I am utilizing requires it.

The getter should have the capability to accept a function that returns the same type that was initially provided, such as o => o.

Below is a concise example:

function example<A, B>(
    array: A[], 
    getter: (ao: A) => B, 
    key: keyof B, 
    callback: (value: B[keyof B]) => void
) {
    callback(getter(array[0])[key]);
}

example([{b: {c: 1}}], a => a.b, "c", v => {});

Unfortunately, this results in the error message:

Argument of type '"c"' is not assignable to parameter of type 'never'.

However, the following example does function correctly:

function alternate<A>(
    array: A[], 
    key: keyof A, 
    callback: (value: A[keyof A]) => void
) {
    callback(array[0][key]);
}

alternate([{b: 1}], "b", v => {});

Why is the compiler struggling to infer the type of B and are there any potential workarounds I could implement?

typescript generics keyof

Answer 1

Answer №1

The reason why the compiler doesn't infer B is not entirely clear to me. However, based on my intuition, it seems that the compiler finds it easier to infer the type of a parameter that is directly passed to a function rather than inferring a type related to the passed-in parameter. As a solution, it might be helpful to replace B with Record<K,V>, where K represents the actual key passed in and V represents the value type associated with that key.

For those unfamiliar, Record<K,V> is a part of the TypeScript standard library and is defined as:

type Record<K extends string, T> = {
    [P in K]: T; 
}

With this change, the function would look like:

function foo<A, K extends string, V>(
    array: A[], 
    getter: (ao: A) => Record<K,V>, 
    key: K, 
    callback: (value: V) => void
) {
    callback(getter(array[0])[key]);
}

Running this function with specific parameters like:

foo([{ b: { c: 1 } }], a => a.b, "c", v => { });

Correctly infers the parameters as

<{ b: { c: number; }; }, "c", number>

.

Hopefully, this explanation is helpful. Best of luck!

Update

After evaluating a specific call:

foo([{ b: { c: 1, d: "" } }], a => a.b, "c", v => { });

The inferred types were:

foo<{ b: { c: number; d: string; }; }, "c" | "d", string | number>(...)

To address this issue where you want K to be just "c", you can adjust the function slightly by lowering the priority of inferences as shown below:

function foo<A, K extends string, V>(
  array: A[],
  getter: (ao: A) => Record<K & {}, V>, 
  key: K, 
  callback: (value: V) => void
) {
  callback(getter(array[0])[key]);
}

This adjustment allows for correct inference when calling:

foo([{ b: { c: 1, d: "" } }], a => a.b, "c", v => { });

Which now infers as

foo<{ b: { c: number; d: string; }; }, "c", {}>(...)

Any other scenarios we need to account for?

Answer 2

The reason why the compiler doesn't infer B is not entirely clear to me. However, based on my intuition, it seems that the compiler finds it easier to infer the type of a parameter that is directly passed to a function rather than inferring a type related to the passed-in parameter. As a solution, it might be helpful to replace B with Record<K,V>, where K represents the actual key passed in and V represents the value type associated with that key.

For those unfamiliar, Record<K,V> is a part of the TypeScript standard library and is defined as:

type Record<K extends string, T> = {
    [P in K]: T; 
}

With this change, the function would look like:

function foo<A, K extends string, V>(
    array: A[], 
    getter: (ao: A) => Record<K,V>, 
    key: K, 
    callback: (value: V) => void
) {
    callback(getter(array[0])[key]);
}

Running this function with specific parameters like:

foo([{ b: { c: 1 } }], a => a.b, "c", v => { });

Correctly infers the parameters as

<{ b: { c: number; }; }, "c", number>

.

Hopefully, this explanation is helpful. Best of luck!

Update

After evaluating a specific call:

foo([{ b: { c: 1, d: "" } }], a => a.b, "c", v => { });

The inferred types were:

foo<{ b: { c: number; d: string; }; }, "c" | "d", string | number>(...)

To address this issue where you want K to be just "c", you can adjust the function slightly by lowering the priority of inferences as shown below:

function foo<A, K extends string, V>(
  array: A[],
  getter: (ao: A) => Record<K & {}, V>, 
  key: K, 
  callback: (value: V) => void
) {
  callback(getter(array[0])[key]);
}

This adjustment allows for correct inference when calling:

foo([{ b: { c: 1, d: "" } }], a => a.b, "c", v => { });

Which now infers as

foo<{ b: { c: number; d: string; }; }, "c", {}>(...)

Any other scenarios we need to account for?

Answer 3

Answer №2

Like @jcalz, my approach doesn't rely on a specific reason, but rather a workaround. By breaking it down into two separate calls, you can first set A and B, then in the second call, provide the key and callback to ensure correct inference of types.

function foo2<A, B>(
    array: A[],
    getter: (ao: A) => B,
) {
    return function <K extends keyof B>(key: K, callback: (value: B[K]) => void) {
        callback(getter(array[0])[key]);
    }
}

foo2([{ b: { c: 1, d: "" } }], a => a.b)("d", v => { }); // v is string
foo2([{ b: { c: 1, d: "" } }], a => a.b)("c", v => { }); // v is number

Although the syntax may be a bit clunkier, this method ensures complete type safety.

Answer 4

Like @jcalz, my approach doesn't rely on a specific reason, but rather a workaround. By breaking it down into two separate calls, you can first set A and B, then in the second call, provide the key and callback to ensure correct inference of types.

function foo2<A, B>(
    array: A[],
    getter: (ao: A) => B,
) {
    return function <K extends keyof B>(key: K, callback: (value: B[K]) => void) {
        callback(getter(array[0])[key]);
    }
}

foo2([{ b: { c: 1, d: "" } }], a => a.b)("d", v => { }); // v is string
foo2([{ b: { c: 1, d: "" } }], a => a.b)("c", v => { }); // v is number

Although the syntax may be a bit clunkier, this method ensures complete type safety.

Universal key and attribute retrieval function

Answer №1

Update

Answer №2

Similar questions

Leverage the same JSDoc comment across multiple TypeScript interfaces

Tips for aligning the types of objects transmitted from a Web API backend to a React/Redux frontend

Testing Jasmine with objects that contain optional properties

Exploring the integration of React.Components with apollo-client and TypeScript

Execute a function that handles errors

Is there a way to turn off tsc pretty printing using the configuration file?

Extend the row of the table according to the drop-down menu choice

What's the best way to include various type dependencies in a TypeScript project?

The button event listener in React fails to trigger without a page refresh

Error: Unable to attach the "identity" property as the object does not support extension

What is the process for creating an additional username in the database?

Make leaflet function operate synchronously

The role of callback functions in TypeScript

What is the best way to invoke a function in a functional React component from a different functional React component?

Troubleshooting Puppeteer compatibility issues when using TypeScript and esModuleInterop

Angular tabs display the initial tab

Exploring ways to exclude a column in a TypeORM entity while also providing the flexibility to make it optional for retrieval using the Find method

The parameter must be of type 'string', but you are attempting to assign a 'Promise<any>'

Dealing with Uncaught Promises in Angular 2 while injecting a service

"Learn the process of integrating Javascript files from the Angular assets folder into a specific Angular component or module (such as Angular 2, 4,