Typescript access dynamic property with [' '] syntax

Question

export class Foo{
 someproperty: string;
}

I am trying to understand why, when trying to access dynamic object property I can do the following as I saw on one of the answers here:

let fooObj: foo = someObj['someproperty'];

but by doing this, I get an error.

let fooObj: foo = someObj.someproperty;

I am trying to understand, why the first method works for accessing/assigning to dynamic objects.

Error:

"someproperty does not exist on type"

Question asked before here, answer by Angelo R is the one I am interested in.

question

What exactly does "doesn't work" mean? Do you get an error? If so, what exactly does it say? — Pointy, May 02 '17 at 14:31
"someproperty does not exist on type", but on the type it does exist — Harry, May 02 '17 at 14:32
Add to your question the code which defines the type of `someObj` and how you assign a value to it. — Nitzan Tomer, May 02 '17 at 14:36

score 24 · Accepted Answer · answered May 02 '17 at 14:42

24

This is just a convention in TypeScript, available for convenience. If you want to access some arbitrary property that is not defined in the type signature of the object, you can use the ["foo"] notation, and the type checker will not try to enforce that the instance you're accessing has such a property in its type signature.

answered May 02 '17 at 14:42

Asad Saeeduddin

46,193
6
90
139

7

More about this in the TypeScript specification: [4.13 Property Access](https://github.com/Microsoft/TypeScript/blob/1db4f96fd14fc3de5ae3704e925afd6474cfb8f5/doc/spec.md#4.13) – cbr May 02 '17 at 15:05

Moisés Guilherme Paschoalick · Answer 2 · 2022-01-29T14:22:26.147

The way I foud to pass propery of object is using const myproperty = 'name' as const;

type MyObject = {
        name: string,
        age: number;
    }

    let obj:MyObject = {name: 'Ryu', age:30};
    const myproperty = 'name' as const;
    
    console.log(obj[myproperty])

For example, if you want to pass parameters on the function called sum() to sum all property 'visited', another time you want to sum all deals in this same function, using property 'deals', you can put all properties on an array and passing a index of this array, sum(0) or sum(1).

type Sale = {
    id: number;
    visited: number;
    deals: number;
    amount: number;
 }

let data:Array<Sale> =[{id: 1, visited: 83, deals: 66, amount: 5501},
{id: 2, visited: 113, deals: 78, amount: 8290},
{id: 3, visited: 36, deals: 12, amount: 6096}]

const args = ['visited',  'deals', 'amount'] as const;

 const sum = (property:number) => {

        let total:number = 0;
        data.forEach((element) => {
            
            total += element[args[property]];
        });
        
        return total;
    }
    
console.log(sum(0))  //Visited  
console.log(sum(1))  //deals
console.log(sum(2))  //amount

Or you can use enum for more general use.

 enum CategoryOfSum{
        VISITED = 'visited',
        DEDALS = 'deals',
        AMOUNT = 'amount'
    }
    
    const sum = (type:CategoryOfSum) => {

        let total:number = 0;
        data.forEach((element) => {
            
            total += element[type];
        });
        
        return total;
    }

sum(CategoryOfSum.VISITED)
sum(CategoryOfSum.DEDALS)
sum(CategoryOfSum.AMOUNT)

Typescript access dynamic property with [' '] syntax

2 Answers2

Linked