TypeScript: Indexable type, string[] is not assignable

Question

TypeScript's has Indexable type which let us describe types we can index into. e.g. One can define an string array like this:

interface StringArray { 
  [key: number]: string;
}

let x: StringArray = ['Sheldon', 'Cooper'];
x[0] = 'John';
x[1] = 'Snow';

By looking at the index signature [key: number]: string; what I understand is, it defines the name of the key/index: key and the type of the key: string, and the type of the value which is returned i.e. number. Now when I change type of the key to string I get an error.

interface MyStringArray { 
  [key: string]: string;
}

//Type 'string[]' is not assignable to type 'MyStringArray'.
//Index signature is missing in type 'string[]'. 
var y: MyStringArray = ['Sheldon', 'Cooper']; //<- causes the error
y[0] = 'John';
y[1] = 'Snow';

I am not able to understand why it shows up the warning when I change key's type to string. Why it's not happening when key 's type is numeric. Is it because of array cause array indexes are numeric?

And what happens when we have both indexed type and other properties.

Example 1: It shows error with indexer type

interface NumberDictionary {
    [index: string]: number;
    length: number;    // ok, length is a number
    name: string;      // error, the type of 'name' is not a subtype of the indexer
}

Example 2: It does not shows error when I change type of [index:string] to [index: number]

interface NumberDictionary {
    [index: number]: number;
    length: number;    // ok, length is a number
    name: string;      // after chaning `index` type to number it's does'nt show error
}

Rafal · Accepted Answer · 2017-01-27 07:37:30Z

4

The syntax [key: number]: string defines the numeric key and the value as string (other way around then you described). And array of strings is indexed by numbers so it can be described with such a construct.

as to your interfaces consider one more:

interface NumberDictionary {
    [index: number]: number;
    prop: string;    // ok, irrelevant to indexer as prop is not a number
    '1': string;      // error - must return number
}

Only properties that meet the key requirement of being a number are validated against the index return type. This makes sense as you cannot access prop using [] syntax.

answered Jan 27, 2017 at 7:37

Rafal

12.7k34 silver badges56 bronze badges

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

Comments

Ashish Mulaye · Accepted Answer · 2017-01-27 11:52:11Z

0

Yes. It is because string[] uses numeric index. If you want to use index as a string then you need to change the code something like below.

interface StringArray {
    [index: string]: string;
}

let myArray: StringArray;
myArray["1"] = "Bob";
myArray["2"]="Fred";

let myStr: string = myArray[0];

what happens when we have both indexed type and other properties.

Well, As per the Documentation,

There are two types of supported index signatures: string and number.

So example 1 is of type string index signature so they enforce all properties to match their return type.

While string index signatures are a powerful way to describe the “dictionary” pattern, they also enforce that all properties match their return type. This is because a string index declares that obj.property is also available as obj["property"].

When you changed it to number in example 2, it changed NumberDictionary to number index signature so it will allow the properties to have any return type.

edited Jan 27, 2017 at 11:52

answered Jan 27, 2017 at 7:30

Ashish Mulaye

2561 gold badge3 silver badges13 bronze badges

5 Comments

Hitesh Kumar Over a year ago

what about this what happens when we have both indexed type and other properties.

Ashish Mulaye Over a year ago

explained in stackoverflow.com/questions/39599602/…

Hitesh Kumar Over a year ago

Your link doe not explain reason for this: It does not shows error when I change type of [index:string] to [index: number]

Rafal Over a year ago

@AshishMulaye number dictionary will validate number properties of the object see my example

Ashish Mulaye Over a year ago

Yes. That is correct. However, if you use the string index signature, all the properties must also have type string which is not the case if you use number index signature. e.g. in your answer "prop" can be of type string, but if you use [index: string]: number; then "prop" will only allow string.

Collectives™ on Stack Overflow

TypeScript: Indexable type, string[] is not assignable

2 Answers 2

Comments

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related