Type 'string' cannot be used to index ... | TypeScript Community | Page 1

hard field Feb 2, 2023, 9:59 AM

#

Hi, I'm trying to write such a code:



export type OptionValue = string | boolean | number | (string | null)

export class Option<T> {
    value: T
    constructor(value:T) {
        this.value = value
    }
}

interface GroupLike {
    options?: Record<string, Option<OptionValue>>
}

class Group<Options extends Record<string, Option<OptionValue>>> {
    options: Options
    constructor(cfg: { options: Options}) {
        this.options = cfg.options
    }

    merge<Options2 extends Record<string, Option<OptionValue>>>(
        other: Group<Options2>
    ) {
        if (other.options != null) {
            for (const [name, option] of Object.entries(other.options)) {
                const existingOption = this.options[name]
                this.options[name] = option
            }
        }
        //
    }
}

But TS tells me that options[name] = option is invalid, as options cant be indexed with string. What's interesting, the previous line works : const existingOption = this.options[name]. Would anyone be so nice and help me figure it out, please? 🙂

tepid spindle Feb 2, 2023, 10:08 AM

#

Hi...

hard field Feb 2, 2023, 10:09 AM

#

Hi! 😄

tepid spindle Feb 2, 2023, 10:09 AM

#

When you free, look at the DM

hard field Feb 2, 2023, 10:10 AM

#

Oh, sorry for not replying yet! I will later today

tepid spindle Feb 2, 2023, 10:11 AM

#

no worries

#

this reason is Options may be a literal object type, so TS is not sure string can use in the Options type variable

ripe heartBOT Feb 2, 2023, 10:15 AM

#

Nctdt#2630

Playground Link

Preview:ts ... ;(this.options[ name ] as Option<OptionValue>) = option ...

hard field Feb 2, 2023, 10:16 AM

#

but Options extends Record<string, Option<OptionValue>> so how it could be a literal type ?

tepid spindle Feb 2, 2023, 10:16 AM

#

ripe heart

but I think that not a good particle

ripe heartBOT Feb 2, 2023, 10:17 AM

#

Nctdt#2630

Playground Link

export class Option<T> {
value: T
constructor(value: T) {
this.value = value
}
}

class Group<
Options extends Record<string, Option<OptionValue>>

{
options:
...```

tepid spindle Feb 2, 2023, 10:17 AM

#

!ts

ripe heartBOT Feb 2, 2023, 10:17 AM

#

export type OptionValue = string | boolean | number | (string | null)

export class Option<T> {
    value: T
    constructor(value:T) {
        this.value = value
    }
}

class Group<Options extends Record<string, Option<OptionValue>>> {
    options: Options
    constructor(cfg: { options: Options}) {
        this.options = cfg.options
    }

    merge<Options2 extends Record<string, Option<OptionValue>>>(
        other: Group<Options2>
    ) {
        if (other.options != null) {
            for (const [name, option] of Object.entries(other.options)) {
//                                              ^^^^^^^
// Property 'entries' does not exist on type 'ObjectConstructor'. Do you need to change your target library? Try changing the 'lib' compiler option to 'es2017' or later.
                ;(this.options[name] as Option<OptionValue>) = option
            }
        }
        //
    }
}

const foo = new Group({
    options: {
        test: new Option('')
    }
})
foo
// ^? - const foo: Group<{
//     test: Option<string>;
// }>```

tepid spindle Feb 2, 2023, 10:17 AM

#

@hard fieldlike this foo

#

Options is literal object type

#

Since name is a string type, TypeScript cannot confirm if it is present as an index in this.options.

#

(May I understand is wrong

hard field Feb 2, 2023, 10:21 AM

#

Wait, here options is an object and it has a field test, so we should be able to index it by field name, right?

tepid spindle Feb 2, 2023, 10:22 AM

#

yep

#

but TS don't know

hard field Feb 2, 2023, 10:24 AM

#

I mean, it should know if Options extends Record<string, Option<OptionValue>>, what could I put there that would not be indexable with string? I dont see it in your code

ripe heartBOT Feb 2, 2023, 10:27 AM

#

Nctdt#2630

Playground Link

export class Option<T> {
value: T
constructor(value: T) {
this.value = value
}
}
type OptionsType = Record<string, Option<OptionValue>>
class Group<
Options extends Record<string, Option<Op
...```

tepid spindle Feb 2, 2023, 10:31 AM

#

hard field I mean, it should know if `Options extends Record<string, Option<OptionValue>>`,...

the reason is before my answer(the literal object), TS for the typesafe
look this Playground link (but this isn't good particle

hard field Feb 2, 2023, 10:35 AM

#

Wait, but what's the diffferencebetween your code and mine? I think Im blind but I dont see any implementation idfference here

tepid spindle Feb 2, 2023, 10:39 AM

#

because, I use as keyword to narrow the type

#

so TS know type is correct

#

sorry, I have finished my work, I'm going back home.

hard field Feb 2, 2023, 10:45 AM

#

No worries, thanks so much. Anyway, I'm still interested in knowing why we need to narrow the type and why TS doesnt know that by itself 😦

molten anchor Feb 2, 2023, 3:07 PM

#

@hard field I'm thinking the root issue is probably this:

#

!*:unsafe-keys

ripe heartBOT Feb 2, 2023, 3:07 PM

#

Retsam19#2505

`!retsam19:unsafe-keys`:

Since TS allows objects to have extra properties not specified in the type, it doesn't assume that all the keys on the type are the only keys on the object. This means that Object.keys returns string[] not a specific type, and for(const key in obj), key is string, (not keyof typeof obj).

If you wish to assume otherwise, this utility is often helpful:

// A signature for `Object.keys` that assumes the only keys are the ones indicated by the type
const unsafeKeys = Object.keys as <T>(obj: T) => Array<keyof T>;

molten anchor Feb 2, 2023, 3:07 PM

#

name is string, and not a known key of this.options

#

Well... actually, maybe it's not that. That may be part of it, but I think there's also the issue that Options2 might have keys that aren't actually keys of this.options at all.

#

Or, worse, might be keys but have different values.

#

Consider:

ripe heartBOT Feb 2, 2023, 3:16 PM

#


declare const g1: Group<{ x: Option<string> }>;
declare const g2: Group<{ x: Option<number> }>;

g1.merge(g2);
g1.options.x 
//         ^? - (property) x: Option<string>
// But it's actually Option<number> at runtime

molten anchor Feb 2, 2023, 3:19 PM

#

TS is actually correct that this type, as written isn't type-safe. @tepid spindle's fix changes options to be Record<string, Option<OptionValue>>, which avoids this issue by not having the options property try to be specific about what properties it holds. Avoids the issue, but the types are less specific:

ripe heartBOT Feb 2, 2023, 3:19 PM

#


declare const g1: Group<{ x: Option<string> }>;
declare const g2: Group<{ x: Option<number> }>;

g1.merge(g2);
g1.options.x 
//         ^? - Option<OptionValue>
g1.options.litearllyAnything
//         ^? - Option<OptionValue>

tepid spindle Feb 2, 2023, 3:55 PM

#

ripe heart ```ts declare const g1: Group<{ x: Option<string> }>; declare const g2: Group<{...

yep, need to write a new utils type to return the merged type

tepid spindle Feb 2, 2023, 4:26 PM

#

@hard fieldhttps://github.com/microsoft/TypeScript/issues/47357

GitHub

`Type 'string' cannot be used to index type 'T'` when indexing a ge...

Bug Report 🔎 Search Terms Type 'string' cannot be used to index type 'T'. 🕗 Version & Regression Information This is the behavior in every version I tried, a...

#Type 'string' cannot be used to index ...