Javascript 反应：如果值是按值传递的，为什么有必要使用不可变的道具？

我不太喜欢JavaScript。因此，我们进行了以下修补：

var demo = 'test';

var obj = {
  x: 'abc'
}

function foo(str) {
  str += '_123';

  return str;
}

var ret = foo(demo);
var retObj = foo(obj.x);

console.log('Result: %s', ret); // => 'test_123'
console.log('Used parameter: %s', demo); // 'test'

console.log('Result: %s', retObj); // 'abc_123'
// The value of the property is still unchanged. So
//  it has been passed in as by value. As as copy.
console.log('Used parameter: %s', obj.x); // 'abc'

我向函数传递一个字符串。一次作为基本变量，下一次作为对象属性

之后，原始数据保持不变。=>外部系统不变

现在我想知道：

为什么它们在React中具有这些不变性特性

我的意思是：他们说函数应该做一些事情，并提供结果。但不改变整个系统

---

但如果数据还是按值传递呢？为什么函数会因为具有不变性而变得如此重要？

在这两个示例中，您都向函数传递了一个字符串

obj

是一个对象，但是

obj.x

是一个字符串

JavaScript将字符串和数字（原语）视为不可变的。因此，如果你这样做：

var a = "bob";
var b = a;
b = "jack";

原始字符串

a

将保持不变

但对象是不同的。如果您这样做：

var propsObj = { name: "bob" };
var newPropsObj = propsObj;
newPropsObj.name = "jack";

然后

propsObj

也会改变，所以

propsObj

现在是

{name:“jack”}

React使用您传递的东西作为道具和状态来创建其虚拟DOM。因为react使用这些来查看是否有任何更改，并且只呈现确实更改的内容，所以react依赖于您的代码，在您将其传递给react之后，不会更改道具或状态

---

在第二个示例中，这将导致react认为新道具和旧道具仍然相同，因此react将（错误地）得出无需重新渲染的结论。

如果将实际对象传递给函数，则函数可能会改变该对象（包括更改或删除其现有属性并添加新属性）.并非所有内容都是按值传递的。可能重复