Loop array returns element of type string instead of array's type

Question

I have problems looping a TypeScript array. These are the methods:

getNotification(evt: string, rowIndex: number) {
    console.log("Production order: law has changed to " + evt + " " + rowIndex);
    var select = document.getElementsByName("ProductId-" + rowIndex);

    this.removeOptions(select);

    if ((evt != null) && (evt != "")) {
        let productsByLaw: IProduct[];

        productsByLaw = this.products.filter(x => x.lawId == +evt);
        for (let product in productsByLaw) {
            select.options[select.options.length] = new Option(product.name, product.productid);
        }
    }

}

removeOptions(selectbox : any) {
    var i;
    for (i = selectbox.options.length - 1; i >= 0; i--) {
        selectbox.remove(i);
    }
}

I don't know why this Option(product.name, product.productid) throw this error:

Error TS2339 (TS) Property 'name' does not exist on type 'string'.
Error TS2339 (TS) Property 'productid' does not exist on type 'string'.

Why product is a string instead of type IProduct ?

Answer 1

for ... in iterates the property keys of an object. for ... of iterates the elements of an array. Use for ... of instead.