Typescript type safe update of property by string property name

Question

I'm needing to update the value of a property of a class by a string property name. I started off by making sure the property name was valid via this method:

export class ClientDTO {
    ...

    static isValidPropertyName(name: string): name is keyof ClientDTO {
        return (name as keyof ClientDTO) !== undefined
    }
}

And then in another class I'm doing this:

foo(key: string, newValue: string) {
  if (!ClientDTO.isValidPropertyName(key)) {
    return
  }

  if (newValue !== this.originalClient[key]) {
    // @ts-ignore
    this.originalClient[key] = newValue
  }
}

The lookup works well now, but to do the update I'm having to put the // @ts-ignore there and I'd really like to figure out how to do this properly without having to have the ignore there.

I have strict checkings turned on so I get the error

TS2322: Type 'any' is not assignable to type 'never'

Are you sure name as keyof ClientDTO is validating anything at runtime? Does ClientDTO have any non-string properties? — Jeff Bowman
– Jeff Bowman, Commented May 9, 2020 at 0:47
I am assuming that that this.originalClient is an instance of ClientDTO, right? If so, are all of the instance properties on it of type string? Or is there a mix of types? — CRice
– CRice, Commented May 9, 2020 at 0:47
Yes it’s a ClientDTO. It’s a mix of types. String, Boolean, date and number. — Gargoyle
– Gargoyle, Commented May 9, 2020 at 0:48

Jeff Bowman · Accepted Answer · 2020-05-09 01:03:09Z

1

return (name as keyof ClientDTO) !== undefined

This doesn't check that name is a key of ClientDTO. It asserts that it is, and then checks whether the string is undefined. Try it in the playground.

Even if that worked, it would only check that the string is a valid key of ClientDTO, but does not say which one it is. Therefore, Typescript checks that the type you're setting is safely assignable to any key of ClientDTO; since ClientDTO contains "a mix of types" including "String, Boolean, date and number", the only safe value to assign is never.

For you to safely assign a newValue: string, you'll need a function that ensures at runtime that your key is for a string-typed property, which might involve some duplication.

class MyClass {
    constructor(
        public a: string,
        public b: string,
        public c: string,
        public x: number,
        public y: number,
        public z: number) { }
}

function isStringProperty(propertyName: string): propertyName is "a" | "b" | "c" {
    return ["a", "b", "c"].indexOf(propertyName) >= 0;
}

function isNumberProperty(propertyName: string): propertyName is "x" | "y" | "z" {
    return ["x", "y", "z"].indexOf(propertyName) >= 0;
}

function setString(dto: MyClass, key: string, newValue: string) {
    if (isStringProperty(key)) {
        dto[key] = newValue;
    }
}

function setNumber(dto: MyClass, key: string, newValue: number) {
    if (isNumberProperty(key)) {
        dto[key] = newValue;
    }
}

typescript playground

See also: Typescript error：Type 'number' is not assignable to type 'never'

answered May 9, 2020 at 1:03

Jeff Bowman

96.2k19 gold badges227 silver badges266 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Gargoyle Over a year ago

Thanks. I didn't know about typescriptlang.org/play, that's so awesome!

Marcel Waldvogel Over a year ago

BTW: ["x", "y", "z"].includes(propertyName) is slightly more compact (elegant?) and available and available since many years

Jeff Bowman Over a year ago

@MarcelWaldvogel And it is completely not supported in Internet Explorer, for which Microsoft only retired support last month. I'm afraid it not practical for me to rephrase the answer in every combination of compatibility and elegance, and I'm sorry my default now and in May 2020 did not match your current opinion.

Marcel Waldvogel Over a year ago

This wasn't meant to show your ignorance or to point out the age of yesteryear's code, quite the opposite. SO is used by many novice programmers to build their skills and style or adapt best practices. The comment was meant for them. (As TS is transpiled anyway, I prefer to use new language constructs and APIs whenever useful, and use things like es6-shim to polyfill API differences. But these are personal opinions and/or business decisions.)

CRice · Accepted Answer · 2020-05-09 01:19:34Z

1

The problem is that your custom type guard:

isValidPropertyName(name: string): name is keyof ClientDTO { ... }

is guarding against any key of ClientDTO, so when you try to use it:

this.originalClient[key] = newValue // newValue is type string

TypeScript is tries to infer the right type for the value of this.originalClient[key]. Since key could be any key of ClientDTO, the value you assign to it must be assignable to all of the value types of those keys. Since you have a mix of value types for those keys, the only type which is assignable to all of them is the bottom type never; a type to which nothing can be assigned, hence the error.

To fix this, note that you give newValue type string. So restrict your type guard to only those keys of ClientDTO who's values are strings:

type KeysWithStringValues<T extends {}> = {
    [K in keyof T]: T[K] extends string ? K : never;
}[keyof T];

class ClientDTO {
    /* ... */
    static isValidPropertyName(name: string): name is KeysWithStringValues<ClientDTO> {
        // Make sure to replace this with code that ACTUALLY enforces
        // the above constraint.
        return name !== undefined
    }
}

Playground Link.

edited May 9, 2020 at 1:19

answered May 9, 2020 at 1:14

CRice

32.6k5 gold badges63 silver badges75 bronze badges

1 Comment

Gargoyle Over a year ago

This is cool but seems not not work well when you start throwing in optional types.

Collectives™ on Stack Overflow

Typescript type safe update of property by string property name

2 Answers 2

4 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related