Question

我对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'

我将一个字符串传递给该函数。一次作为原始变量，下一次作为对象属性。

之后原始数据不变。 =＆GT;外部系统没有变化。

现在我想知道：

为什么他们在React中具有这些不变性功能？

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

但是，如果按值传递数据呢？为什么在不变性方面做出如此大的事情呢？

Answer 1

在两个示例中，您都将字符串传递给函数。 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：如果按值传递值，为什么有必要使用不可变的道具？

1 个答案: