ReactJS and immutability

Question

I've learning ReactJS for a while now. One of the thing that puzzles me is why ReactJS uses immutability in many aspects like props, elements etc. Is there any specific reason for this? What is the philosophy behind this?

When I try to add new property to props I'm getting the below error.

Uncaught TypeError: Can't add property me, object is not extensible

Answer 1

The philosophy behind this is one way data flow — data flows down (from top level to leaf components) and actions flow up.

A component receives its data from props, and to change something, it has to call into its parent and ask it to change something — via a callback function usually.

You can read more about it on the Thinking in React page of the official website, it explains the concept pretty well.