typeof on object index access types don't include undefined when noUncheckedIndexedAccess

[DetachHead]

Bug Report

🔎 Search Terms

noUncheckedIndexedAccess

🕗 Version & Regression Information

4.2.0-dev.20210124

⏯ Playground Link

https://www.typescriptlang.org/play?noUncheckedIndexedAccess=true&ts=4.2.0-dev.20210124#code/CYUwxgNghgTiAEYD2A7AzgF3gMyUgXPCgK4C2ARiDANoC6AsAFBMYCeADggGJ7wC88NpyTYceagEZa8APQySFKkybJ0WcrEI8k-MUknS5AFQ4IA5Asox4AH3jEUobAEsUIYGfjO0RJFihoaM4A5ihQ5BAIGDpC5pZUZkA

Playground link with relevant code

💻 Code

declare const foo: number[]

type Foo = typeof foo[1] //number

const bar: Foo = foo[1] //Type 'number | undefined' is not assignable to type 'number'

🙁 Actual behavior

typeof foo[1] returns number, but the actual type is number|undefined

🙂 Expected behavior

typeof foo[1] should return number | undefined when noUncheckedIndexedAccess is enabled

[MartinJohns]

typeof foo[1] should return number | undefined when noUncheckedIndexedAccess is enabled

But why? Your array only stores numbers, it doesn't store undefined values, unlike (number | undefined)[].

Note that typeof foo[1] is equivalent to typeof foo[number]. It returns the arrays element type, which in this case is number. It doesn't distinguish between any position.

If foo would be a tuple, then typeof foo[1] would give you the type of the second tuple element.

noUncheckedIndexedAccess only adds the undefined when accessing the array. It's just an added safety check. It does not change what type is stored in the array. Otherwise assigning undefined would be possible as well.

[DetachHead]

i don't understand why the type would be different when accessing it vs when using typeof on it. even though the type is number[] rather than (number|undefined)[] from my understanding they're pretty much the same thing (most of the time) when noUncheckedIndexedAccess is enabled

[MartinJohns]

typeof provides you the type of the values stored in the array. In your array you don't have any undefined values stored, it's not allowed by the type. When your type is (number | undefined)[] then you can actually store undefined values in your array. This is the same behavior, regardless of your noUncheckedIndexedAccess setting.

const arr1: number[] = [];
arr1.push(undefined); // Forbidden, array does not store undefined values.

const arr2: (number | undefined)[] = [];
arr2.push(undefined); // Allowed, array does store undefined values.

Accessing array element returns a union with undefined with noUncheckedIndexedAccess due to the behavior of JavaScript returning undefined when no value was assigned to the index.

Note that explicitly assigning undefined and no value existing are different things:

const arr = [undefined];
console.log(arr.hasOwnProperty(0)); // true, element at index 0 exists (even if the value is undefined).
console.log(arr.hasOwnProperty(1)); // false, no element at index 1 exists.

[jcalz]

This is currently the intended behavior and not a bug; see #39560

• Indexed access types, e.g. type A = SomeType[number], retain their current meaning (undefined is not added to this type)

Perhaps this should be rephrased as a feature request?

[DetachHead]

I see. Would anybody happen to know how to create a type with noUncheckedIndexedAccess in mind where the length is between 0 and a specified number?

For example, I'm writing a bunch of helper functions to make working with noUncheckedIndexedAccess easier such as

export function lengthGreaterThan<T, L extends number>(
    arr: Readonly<T[]>,
    length: L
): arr is [...TupleOf<T, L>, T] & T[] { //see https://github.com/microsoft/TypeScript/issues/26223#issuecomment-674514787
    return arr.length > length
}

which means you no longer have to check for undefined when accessing an index within that range:

if (lengthGreaterThan(foo, 3)) {
    const a: string = foo[0] //no error
    const b: string = foo[3] //no error
    const c: string = foo[4] //Type 'string | undefined' is not assignable to type 'string'
}

How would I make a type for a lengthLessThan equivalent where the length is known to be less than a certain number like a tuple, but accessing indexes up to that number can still possibly be undefined?

I tried TupleOf<T | undefined, L> but obviously that's subject to the differences @MartinJohns mentioned as well as having unexpected behaviour when noUncheckedIndexedAccess isn't enabled.

[DetachHead]

i think i figured out a way to do it if anybody is curious

const indexedAccessCheck = ([] as never[])[0]
export type NoUncheckedIndexedAccess = undefined extends typeof indexedAccessCheck ? true : false
export type TupleOfUpTo<T, L extends number> = TupleOf<T, L> | (NoUncheckedIndexedAccess extends true ? [] : never)

export function lengthLessOrEqual<T, L extends number>(arr: Readonly<T[]>,length: L): arr is TupleOfUpTo<T, L> {
	return arr.length <= length
}

i've done minimal testing though, there's probably a lot wrong with it

[typescript-bot]

This issue has been marked as 'Question' and has seen no recent activity. It has been automatically closed for house-keeping purposes. If you're still waiting on a response, questions are usually better suited to stackoverflow.