I have following code and I would like to pass number from value key of variable object, How can I use variable for optional chaining operator for it to solve the error Element implicitly has an any type?

    function fun(i?: number) {
        console.log(i)
    }

    const variable = { min: { value: 1, name: 'google' }, max: {value: 2, name: 'apple'} }
    const variable2 = { min: { value: 1, name: 'google' } }
    const variable3 = { max: {value: 2, name: 'apple'} }

    fun(variable?.min.value) // working => 1
    fun(variable?.max.value) // working => 2
    fun(variable2?.min.value) // working => 1
    fun(variable2?.max.value) // working => undefined
    fun(variable3?.min.value) // working => undefined
    fun(variable3?.max.value) // working => 2

    Object.keys(variable).forEach((key) => {
        fun(variable?.[key]?.value) // working but with error Element implicitly has an 'any' type because expression of type 'string' can't be used to index type '{ min: { value: number; name: string; }; max: { value: number; name: string; }; }'.
    })

I have following code and I would like to pass number from value key of variable object, How can I use variable for optional chaining operator for it to solve the error Element implicitly has an any type?

    function fun(i?: number) {
        console.log(i)
    }

    const variable = { min: { value: 1, name: 'google' }, max: {value: 2, name: 'apple'} }
    const variable2 = { min: { value: 1, name: 'google' } }
    const variable3 = { max: {value: 2, name: 'apple'} }

    fun(variable?.min.value) // working => 1
    fun(variable?.max.value) // working => 2
    fun(variable2?.min.value) // working => 1
    fun(variable2?.max.value) // working => undefined
    fun(variable3?.min.value) // working => undefined
    fun(variable3?.max.value) // working => 2

    Object.keys(variable).forEach((key) => {
        fun(variable?.[key]?.value) // working but with error Element implicitly has an 'any' type because expression of type 'string' can't be used to index type '{ min: { value: number; name: string; }; max: { value: number; name: string; }; }'.
    })

• javascript
• typescript
• typescript2.0
• typescript1.5
• typescript1.9

Share Improve this question Follow edited Jul 31, 2020 at 23:17 Phix 9,97044 gold badges3838 silver badges6565 bronze badges asked Jul 31, 2020 at 23:14 jacobcan118jacobcan118 9,1791616 gold badges6060 silver badges119119 bronze badges 7

• github./microsoft/TypeScript/issues/13254 – zerkms Commented Jul 31, 2020 at 23:19
• .[key] looks like invalid syntax. Given that you are getting the key by looping over the variable, the variable has to exist. variable[key] should always be valid in the forEach – Taplar Commented Jul 31, 2020 at 23:19
• 2 @Taplar it's not .[key] it's ?.[key], it's a new posite operator. developer.mozilla/en-US/docs/Web/JavaScript/Reference/… – zerkms Commented Jul 31, 2020 at 23:20
• ? there isn't the safety operator? – Taplar Commented Jul 31, 2020 at 23:20
• @Taplar it's a ?.[] operator, optional chaining + indexing. – zerkms Commented Jul 31, 2020 at 23:21

 |  Show 2 more ments

1 Answer 1

Sorted by: Reset to default 5

This isn't actually an optional chaining problem, but a problem with how Object.keys works. Typescript assumes that an object may have more keys than is known at pile time so the type of key here is string and not keyof variable. To get around that you would have to let the TS piler know that all the keys are known at pile time using

Object.keys(variable).forEach((key) => {
  fun(variable[key as keyof typeof variable].value) 
})

You're already treating variable as a non-null variable when you use it in Object.keys so there's no need to additionally use optional chaining on it. Additionally, when you cast key into keyof typeof variable, you're asserting that it already exists so you can remove the optional chaining before ?.value as well.