Скачать или смотреть Understanding the keyof Equivalent in TypeScript

Discover how to use TypeScript's `keyof` equivalent to impose value-based constraints on object properties. Get clear examples and best practices here!
---
This video is based on the question https://stackoverflow.com/q/64024978/ asked by the user 'm. maylon' ( https://stackoverflow.com/u/14326399/ ) and on the answer https://stackoverflow.com/a/64025435/ provided by the user 'Pritam Kadam' ( https://stackoverflow.com/u/5644120/ ) at 'Stack Overflow' website. Thanks to these great users and Stackexchange community for their contributions.

Visit these links for original content and any more details, such as alternate solutions, latest updates/developments on topic, comments, revision history etc. For example, the original title of the Question was: is there a way to describe a kind of "keyfor" in typescript?

Also, Content (except music) licensed under CC BY-SA https://meta.stackexchange.com/help/l...
The original Question post is licensed under the 'CC BY-SA 4.0' ( https://creativecommons.org/licenses/... ) license, and the original Answer post is licensed under the 'CC BY-SA 4.0' ( https://creativecommons.org/licenses/... ) license.

If anything seems off to you, please feel free to write me at vlogize [AT] gmail [DOT] com.
---
Understanding the keyof Equivalent in TypeScript: A Comprehensive Guide

When working with TypeScript, you may encounter a scenario where you want to enforce stricter constraints on object keys based on the type of their associated values. This is a common requirement and can be a bit tricky to implement. In this guide, we will explore how to create a type that acts like keyof, but filters keys based on their value types.

The Challenge

Imagine you have an object with various properties, and you want to define a function that accepts:

An object

A key that corresponds to a property in that object

But with a condition: the key should only be valid if it corresponds to a value that is of a certain type (e.g., an object).

For instance, consider the following example where an object has two properties, a (of type number) and b (of type object). If we try to access the property b (which is an object), it should succeed. Conversely, trying to access property a (which is a number) should fail.

The Solution

To achieve this, we can define a custom type that filters out keys based on their associated value types. Here’s how we can implement this:

Step 1: Define the Custom Type

We need a utility type that will help us extract only those keys whose values are objects. We can achieve this with a mapped type:

[[See Video to Reveal this Text or Code Snippet]]

In this code:

We're iterating over the keys of type T.

For each key P, we're checking if T[P] is an object (using Record<any, any>).

If it is, we add P to our resulting type; otherwise, we return never.

Finally, we get the union of all valid keys.

Step 2: Create the Main Functionality

Next, we implement two functions: one for logging the object and another that applies our new ObjKeys type.

[[See Video to Reveal this Text or Code Snippet]]

objectAction simply logs the object provided.

onlyForObjects uses our custom ObjKeys type to enforce that the passed key must correspond to an object type.

Step 3: Putting It All Together

With everything set up, we can now test our function:

[[See Video to Reveal this Text or Code Snippet]]

In this example:

The first call with key 'b' compiles because b is an object.

The second call with key 'a' does not compile because a is a number, which violates our defined condition.

Conclusion

By employing the techniques described above, you can effectively constrain object properties in TypeScript based on their value types. This approach not only improves type safety but also enhances the clarity and maintainability of your code.

Using TypeScript effectively allows programmers to write more robust, error-resistant applications. We hope this guide helps you understand how to use a keyof equivalent to enforce more specific type constraints in your projects. Happy coding!