Home > Software design >  How to define a (string) array inside an object in TypeScript?
How to define a (string) array inside an object in TypeScript?

Time:11-01

I have the following statement in TypeScript:

let foo = {
  bar: []
};

foo.bar.push("Hello World!");

However VSCode keeps complaining that this isn't allowed.

Argument of type 'string' is not assignable to parameter of type 'never'.ts(2345)

So I try to define the type as follows:

let foo = {
  bar: Array<string>
};

But then I get the message that the method push is not allowed:

Property 'push' does not exist on type '{ (arrayLength: number): string[]; (...items: string[]): string[]; new (arrayLength: number): string[]; new (...items: string[]): string[]; isArray(arg: any): arg is any[]; readonly prototype: any[]; from(arrayLike: ArrayLike): T[]; from<T, U>(arrayLike: ArrayLike<...>, mapfn: (v: T, k: number) => U, thisArg?:...'.ts(2339)

Only way I found it to work was by defining it as follows:

let arr : Array<string> = [];
let foo = {
  bar: arr
};
foo.bar.push('Hello World!')

Why can't I define the type inside the object itself? It seems cumbersome having to extract the types outside of it, into a variable.

CodePudding user response:

This should work:

let foo = {
  bar: [] as string[]
};

You can also do it in a cleaner (imo) way by using a typed variable:

interface Foo {
    bar: string[];
}

let foo: Foo = { bar: [] }

CodePudding user response:

You have at least a couple of choices:

You can define the type of foo inline:

let foo: { bar: string[]; } = {
//     ^^^^^^^^^^^^^^^^^^^^
    bar: [],
};

foo.bar.push("Hello World!");

Playground example

You might even extract that out into a reusable type:

type Foo = { bar: string[]; }; // <=== (You could also use `interface`)
let foo: Foo = {
    bar: [],
};

foo.bar.push("Hello World!");

Playground example

Or you can use a type assertion on the blank array as shown by JC97 (in general, type assertions are best avoided, but an assertion on an empty array is a reasonable exception):

let foo = {
    bar: [] as string[],
};

foo.bar.push("Hello World!");

Playground example

  • Related