Https://www.codecademy.com/paths/web-development/tracks/front-end-applications-with-react/modules/react-102-lifecycle-methods-u/lessons/updating-unmounting-lifecycle-methods/exercises/componentwillreceiveprops

Hi, when working on TopNumber.js in this exercise, I found some code confusing and couldn’t find answers about it. Can someone help me out why ‘highest’
in the constructor state object acts like a string with the quotes, but on the other hand referring the state using this.state.highest which does not include quotes?

export class TopNumber extends React.Component {
  constructor(props) {
    super(props);

    this.state = { 'highest': 0 };
  }

  componentWillReceiveProps(nextProps) {
    if (nextProps.number > this.state.highest) {
      this.setState({
        highest: nextProps.number
      });
    }
  }

  render() {
    return (
      <h1>
        Top Number: {this.state.highest}
      </h1>
    );
  }
}

I will be very grateful if someone can talk about what’s going on here!

Javascript is just a little loose like that… I’d love to know the reason why too. Try this code out:

let obj = { first_property:    'value_1',   
            5:                 'value_2',   
            'stringProperty':  'value_prop'}; 

console.log(obj.first_property) // outputs  value_1
console.log(obj[5])             // outputs  value_2
console.log(obj.stringProperty) // outputs  value_prop

N.B. if it were named 'string property' you saying obj.string property throws an error.

1 Like

Thanks a lot! I’ve tried out your code and it helps me to get more understanding about the usage now :grin: