Typescript – define a Typescript class which has an index signature

typescripttypescript1.5

I have an interface type called IRawParams which simply specifies a string key and any vals.

interface IRawParams {
    [key: string]: any
}

I have a class, ParamValues which contains some behavior on top of keys/values. I'd like to specify that the ParamValues class implements IRawParams interface.

class ParamValues implements IRawParams {
    parseFromUrl(urlString: string) {
        Parser.parse(urlString).forEach(item => this[item.key] = item.val);
    }
}

// so I can do something like this
var params = new ParamValues();
params.parseFromUrl(url);
var userId = params.userId;

When I attempt this, I get a compiler error:

error TS2420: Class 'ParamValues' incorrectly implements interface 'IRawParams'.
Index signature is missing in type 'ParamValues'.

Can I get my class to implement the IRawParams Interface, or otherwise get Typescript to allow instances of my class to be compatible with an indexed type {[key: string]: any}?

Best Answer

To define a class with an index signature, just write the index signature in the class:

interface IRawParams {
    [key: string]: any
}

class Foo implements IRawParams {
    [k: string]: any;
}

Lots of Members

If you need to check a lot of members to determine whether an object matches your type, you could instead add a discriminator. The below is the most basic example, and requires you to manage your own discriminators... you'd need to get deeper into the patterns to ensure you avoid duplicate discriminators.

interface A{
    discriminator: 'I-AM-A';
    member:string;
}

function instanceOfA(object: any): object is A {
    return object.discriminator === 'I-AM-A';
}

var a:any = {discriminator: 'I-AM-A', member:"foobar"};

if (instanceOfA(a)) {
    alert(a.member);
}

Typescript – How to prevent the error “Index signature of object type implicitly has an ‘any’ type” when compiling typescript with noImplicitAny flag enabled

Adding an index signature will let TypeScript know what the type should be.

In your case that would be [key: string]: string;

interface ISomeObject {
    firstKey:      string;
    secondKey:     string;
    thirdKey:      string;
    [key: string]: string;
}

However, this also enforces all of the property types to match the index signature. Since all of the properties are a string it works.

While index signatures are a powerful way to describe the array and 'dictionary' pattern, they also enforce that all properties match their return type.

Edit:

If the types don't match, a union type can be used [key: string]: string|IOtherObject;

With union types, it's better if you let TypeScript infer the type instead of defining it.

// Type of `secondValue` is `string|IOtherObject`
let secondValue = someObject[key];
// Type of `foo` is `string`
let foo = secondValue + '';

Although that can get a little messy if you have a lot of different types in the index signatures. The alternative to that is to use any in the signature. [key: string]: any; Then you would need to cast the types like you did above.

Best Answer

Related Solutions

Javascript – Interface type check with Typescript

Lots of Members

Typescript – How to prevent the error “Index signature of object type implicitly has an ‘any’ type” when compiling typescript with noImplicitAny flag enabled

Related Topic