jimfb · January 22, 2016 22:05 · Dec 21, 2015 · Dec 21, 2015 · Dec 21, 2015 · Dec 21, 2015
diff --git a/props-changing.md b/props-changing.md
@@ -12,4 +12,4 @@ As you can see, the props have clearly "changed" (ie. `componentWillReceiveProps
 
 In general, there is no way to solve this, except to always call `componentWillReceiveProps` any time the values *might* have changed.
 
-If javascript always used value types (like they do for integers; two renders of integers or strings are always "equal" if they are equal from a value-type definition) for all data types, than this problem would not exist.  But because javascript uses reference equality and supports mutation, you can't rely on triple-equals to tell you if two things are conceptually the same.
+If javascript always used value types (like they do for integers; two renders of integers or strings are always "equal" if they are equal from a value-type definition) for all data types, than this problem would not exist.  Also, mutation creates an issue, because the meaning of a value can change (when it is mutated) but is still triple-equals equal to the original prop.  But because javascript uses reference equality and supports mutation, you can't rely on triple-equals to tell you if two things are conceptually the same.
diff --git a/props-changing.md b/props-changing.md
@@ -12,3 +12,4 @@ As you can see, the props have clearly "changed" (ie. `componentWillReceiveProps
 
 In general, there is no way to solve this, except to always call `componentWillReceiveProps` any time the values *might* have changed.
 
+If javascript always used value types (like they do for integers; two renders of integers or strings are always "equal" if they are equal from a value-type definition) for all data types, than this problem would not exist.  But because javascript uses reference equality and supports mutation, you can't rely on triple-equals to tell you if two things are conceptually the same.
diff --git a/props-changing.md b/props-changing.md
@@ -1,4 +1,4 @@
-Suppose a parent renders `<ChildComponent callback={(value)=>setState(value)} />`.  Suppose the parent re-renders.  The pointers will be different (ie. not triple-equals-equal) but the value is conceptually the same for all intents and purposes.  This is a "new value" despite being the "same value".  You run into the same problem when the parent creates an object  `<ChildComponent data={{foo: 'bar', bar: 'noise'}} />` (pointers differ, despite it being the "same" object from a value-type perspective).
+Suppose a parent renders `<ChildComponent callback={(value)=>setState(value)} />`.  Suppose the parent re-renders.  The pointer values of the `callback` prop will be different (ie. not triple-equals-equal) but the `callback` prop's value is conceptually the same for all intents and purposes.  This is a "new value" despite being the "same value".  You run into the same problem when the parent creates an object  `<ChildComponent data={{foo: 'bar', bar: 'noise'}} />` (pointers differ, despite it being the "same" object from a value-type perspective).
 
 You also run into the reverse problem due to mutability. Suppose I say:
 ```

diff --git a/props-changing.md b/props-changing.md
@@ -8,3 +8,7 @@ value.bar = 'drinks';
 ReactDOM.render(<ChildComponent data={value} />, ...);
 ```
 
+As you can see, the props have clearly "changed" (ie. `componentWillReceiveProps` should get called, so the ChildComponent can respond accordingly), but the values are triple-equals-equal.
+
+In general, there is no way to solve this, except to always call `componentWillReceiveProps` any time the values *might* have changed.
+
diff --git a/props-changing.md b/props-changing.md
@@ -0,0 +1,10 @@
+Suppose a parent renders `<ChildComponent callback={(value)=>setState(value)} />`.  Suppose the parent re-renders.  The pointers will be different (ie. not triple-equals-equal) but the value is conceptually the same for all intents and purposes.  This is a "new value" despite being the "same value".  You run into the same problem when the parent creates an object  `<ChildComponent data={{foo: 'bar', bar: 'noise'}} />` (pointers differ, despite it being the "same" object from a value-type perspective).
+
+You also run into the reverse problem due to mutability. Suppose I say:
+```
+var value = {foo: 'bar', bar: 'noise'};
+ReactDOM.render(<ChildComponent data={value} />, ...);
+value.bar = 'drinks';
+ReactDOM.render(<ChildComponent data={value} />, ...);
+```
+
Original file line number	Diff line number	Diff line change
		@@ -12,3 +12,4 @@ As you can see, the props have clearly "changed" (ie. `componentWillReceiveProps

		In general, there is no way to solve this, except to always call `componentWillReceiveProps` any time the values might have changed.

		If javascript always used value types (like they do for integers; two renders of integers or strings are always "equal" if they are equal from a value-type definition) for all data types, than this problem would not exist. But because javascript uses reference equality and supports mutation, you can't rely on triple-equals to tell you if two things are conceptually the same.