Setting value of element in Typescript object

Question

I have defined an object in TS like this:

reportObj : {
  'report' : {
    'pk' : '',
    'uploaded' : '',
    'sections' : {
      'section1' : '',
      'section2' : '',
      'section3' : ''
    }
  }
};

I want to set the value of section1. How can I do this? I am trying:

this.reportObj.report.sections.section1 = data;

This fails and I get the error:

Uncaught (in promise): TypeError: Cannot read property 'report' of undefined

What am I doing wrong?

I defined it inside a function and straight away printed it in the console, but I get undefined. I don't think an object is being created. — Muhammad
– Muhammad, Commented Jan 17, 2017 at 14:18

Nitzan Tomer · Accepted Answer · 2017-01-17 14:24:19Z

1

The definition for the type should be:

reportObj: {
  'report': {
    'pk': string,
    'uploaded': string,
    'sections': {
      'section1': string,
      'section2': string,
      'section3': string
    }
  }
};

Edit

Defining the variable/member type doesn't assign a value to it.
This:

let reportObj: {
    report: {
        pk: string,
        uploaded: string,
        sections: {
            section1: string,
            section2: string,
            section3: string
        }
    }
};

console.log(reportObj.report);

Will fail at runtime because the variable reportObj only has a type, but not a value.
To assign a value:

type Reporter = {
    report: {
        pk: string,
        uploaded: string,
        sections: {
            section1: string,
            section2: string,
            section3: string
        }
    }
};

let reportObj = {} as Reporter;

console.log(reportObj.report); // undefined

But this will still throw a runtime error:

console.log(reportObj.report.pk);

This will assign the right value:

let reportObj = {
    report: {
        sections: {}
    }
} as Reporter;

edited Jan 17, 2017 at 14:24

answered Jan 17, 2017 at 13:56

Nitzan Tomer

166k51 gold badges330 silver badges307 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Nitzan Tomer Over a year ago

Check my revised answer

Muhammad Over a year ago

And after 6 hours of pain, Nitzan to the rescue! Thanks. I only hope the TS docs explained things this way.

Nitzan Tomer Over a year ago

If you use colon after the variable you define the type which is covered in the ts docs. If you use equals after the variable you assign a value which is just like it's done in javascript so the ts docs don't cover it.

Collectives™ on Stack Overflow

Setting value of element in Typescript object

1 Answer 1

Edit

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Edit

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related