React for Real

Get to Know State

We’d like to allow users to edit the word counter text. For this, we need some way to handle values that change over time: a classic book asserts that an object has state if its behavior is influenced by its history (Structure and Interpretation of Computer Programs [AS96]).

Let’s take a little detour to understand state. Open your browser’s JavaScript console and type the add function, which just adds its arguments together and returns the result:

uptospeed/src/functions.js

function add(x, y) {
  return x + y;
}

Then call the add method a few times:

add(1,2); // returns 3
add(5, 7); // returns 12
add(1, 2); // returns 3 again
add(5, 7); // returns 12 again

The return value of add depends only on its ...