Is it possible to confirm that a value is a valid key without prior knowledge of the object's keys during compile-time?

Question

Is it possible to confirm that a value is a valid key without prior knowledge of the object's keys during compile-time?

Is there a way in TypeScript to declare that a variable is a keyof some Record without prior knowledge of the keys?

For instance, consider an API response returning JSON data. Is it possible to define a type for the keys of this payload to ensure that when indexing through the payload, the value will not be undefined? Or must we manually check for undefined each time we access a property in the payload object?

Here's an example:

const payload: Record<string, ValidValue> = await myApiCall()

const prop1 = 'a'
const prop2 = 'b'

if (isValidKey(prop1, payload)) {
  const value1 = payload[prop1] // here, `value1` should have type `ValidValue`
}

const value2 = payload[prop2] // here, `value2` should have type `ValidValue | undefined`

typescript typeguards

Answer 1

Answer №1

I managed to make it work by implementing a type guard function, but with a slight difference – instead of returning key is keyof MyMap, I defined a type for the payload object as

Record<string, ValidValue | undefined>

. The type guard now asserts

payload is Record<K, ValidValue>

, where K corresponds to the key parameter.

You can experiment with this solution on TS Playground.

// Type alias for convenience
type Payload = Record<string, ValidValue | undefined>;

const payload: Payload = await myApiCall()

function isValidKey<K extends string>(key: K, payload: Payload): payload is Record<K, ValidValue> {
  return key in payload;
}

const prop1 = 'a'
const prop2 = 'b'

if (isValidKey(prop1, payload)) {
  const value1 = payload[prop1] // the type of `value1` should evaluate to `ValidValue` ✅
}

const value2 = payload[prop2] // the type of `value2` should evaluate to `ValidValue | undefined` ✅

Answer 2

I managed to make it work by implementing a type guard function, but with a slight difference – instead of returning key is keyof MyMap, I defined a type for the payload object as

Record<string, ValidValue | undefined>

. The type guard now asserts

payload is Record<K, ValidValue>

, where K corresponds to the key parameter.

You can experiment with this solution on TS Playground.

// Type alias for convenience
type Payload = Record<string, ValidValue | undefined>;

const payload: Payload = await myApiCall()

function isValidKey<K extends string>(key: K, payload: Payload): payload is Record<K, ValidValue> {
  return key in payload;
}

const prop1 = 'a'
const prop2 = 'b'

if (isValidKey(prop1, payload)) {
  const value1 = payload[prop1] // the type of `value1` should evaluate to `ValidValue` ✅
}

const value2 = payload[prop2] // the type of `value2` should evaluate to `ValidValue | undefined` ✅

Answer 3

Answer №2

I believe I have stumbled upon a solution that seems to be functioning correctly in the TS playground.

const myMap = [1,2,3].reduce((p, n) => ({ ...p, [Math.random()]: n }), {})

type MyMap = typeof myMap

console.log('myMap', myMap)

function isKnownKey(key: string, thing: MyMap): key is keyof MyMap {
    return Object.keys(thing).includes(key)
}

const knownTypes = ['a', 'b']
const prop1 = Object.keys(myMap)[0]
const prop2 = 'b'

if (isKnownKey(prop1, myMap)) {
    const value1 = myMap[prop1]
    console.log('value1', value1)
}

const value2 = myMap[prop2]
/*
TS Error:
Element implicitly has an 'any' type because expression of type '"b"' can't be used to index type '{}'.
  Property 'b' does not exist on type '{}'.(7053)
*/

However, there's one aspect that is puzzling and eludes my understanding: value1 returns type never. Strangely, there are no TypeScript errors raised. What could possibly be happening in this scenario?

Answer 4

I believe I have stumbled upon a solution that seems to be functioning correctly in the TS playground.

const myMap = [1,2,3].reduce((p, n) => ({ ...p, [Math.random()]: n }), {})

type MyMap = typeof myMap

console.log('myMap', myMap)

function isKnownKey(key: string, thing: MyMap): key is keyof MyMap {
    return Object.keys(thing).includes(key)
}

const knownTypes = ['a', 'b']
const prop1 = Object.keys(myMap)[0]
const prop2 = 'b'

if (isKnownKey(prop1, myMap)) {
    const value1 = myMap[prop1]
    console.log('value1', value1)
}

const value2 = myMap[prop2]
/*
TS Error:
Element implicitly has an 'any' type because expression of type '"b"' can't be used to index type '{}'.
  Property 'b' does not exist on type '{}'.(7053)
*/

However, there's one aspect that is puzzling and eludes my understanding: value1 returns type never. Strangely, there are no TypeScript errors raised. What could possibly be happening in this scenario?

Is it possible to confirm that a value is a valid key without prior knowledge of the object's keys during compile-time?

Answer №1

Answer №2

Similar questions

Developing a Universal Type in Typescript

The file path and installed npm package intellisense does not appear in VS Code until I press Ctrl + space for TypeScript

The reason for duplicating the import of an NPM package in TypeScript (specifically for Firebase Functions)

Using the Typescript type 'never' for object fields: a guide to implementing it

Steps for Adding a JS file to Ionic 3

The issue TS2305 arises when trying to access the member 'getRepositoryToken' from the module "@nestjs/typeorm" which is not exported

angular 2 updating material table

Converting Abstract Type Members from Scala to TypeScript: A Handy Snippet

Ways to retrieve a variable from a separate TypeScript document

Tips for running batch files prior to debugging in VS Code

When using my recursive type on Window or Element, I encounter a type instantiation error stating "Type instantiation is excessively deep and possibly infinite.ts"

Running a method at any given time within an ngFor loop in Angular 5

The beauty of crafting intricate forms with Angular's reactive nested

Creating a TypeScript function that utilizes generics to automatically infer the return type

Accessing the NestJS DI container directly allows for seamless integration of dependency

Attempting to utilize pdf.js may result in an error specifying that pdf.getPage is not a recognized function

Creating interactive features for a TypeScript interface

Differences between TypeScript `[string]` and `string[]`

What benefits does a bundler offer when releasing packages on npm?

Is your async function lacking a return statement?