Constructor array of objects - Typescript

Question

I am using typescript to code in Angular2. I have this object:

export class Car{
    name: String;
    door: {
        position: String;
        id: Number;
    };
}

I have initialized the object following this steps:

constructor() {
    this.door= new Door();
}
export class Door{
    position: String;
    ID: Number
}

and it perfectly works. My problem begins when I try to initialize an array of objects

export class Car{
    name: String;
    door: {
        position: String;
        id: Number;
    };
    color: {
       one: String;
       two: String;

    }[]
}

and I try to do the same Edited

constructor() {
    for (var i = 0; i < 10; i++) {
        this.color.push(new Color);
    }
        this.door= new Door();
    }


export class Color{
    one: String;
    two: String;
}

The error is the following:

ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'push' of undefined TypeError: Cannot read property 'push' of undefined

Solution

The problem is that you declare the color property as tuple with a single item of type {one: string; two: string}

To initialize the tuple you can use

this.color= [new Color()];

Or if you want to declare an array of the type you can use:

color: {
    one: String;
    two: String;
}[]

and initialize it with an empty array:

this.color= [];
// Push 10 elements in the array, you can replace 10 with how many elements you need.
for(let i = 0; i< 10; i++) this.color.push(new Color()); 

More information about tuples here

Comments

[ConnorsFan]

If you want to add the new Color object to the array, you can do: this.color.push(new Color());. Note: color may not be the ideal name for an array. :-)

[bellotas]

My problem is that when I try to access like this.car.color[0].one = "white", it says that it is undefined. I guess that I need to initialize the object previously and that is what I am trying to do

[Titian Cernicova-Dragomir]

@ConnorsFan Actually its not an array it's a tuple type { one: String; two: String; }[] is an array

[bellotas]

At the end it solved the problem just for the first position of the array/tuple but when I try to access to the 2nd one it crash

[Titian Cernicova-Dragomir]

Well the tuple you defined only has one element in theory. If you want an array use the second suggestion in my answer, and initialize with an empty array, and then push as may values in it as you want : ex, adding two elements: this.color= []; this.color.push(new Color(), new Color())

[bellotas]

ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'push' of undefined

[bellotas]

I m gonna edit the question so maybe will be more clear

[Titian Cernicova-Dragomir]

You haven't initialized the array this.color= []; before the for