javascript - React - 拥有不可变 Prop 的最大好处是什么?

标签 javascript reactjs functional-programming

在学习 React 一段时间后,我仍然认为许多概念很难掌握。

其中: Prop 的不变性。

如果我没弄错,那么组件或多或少等同于面向对象编程中的对象。

在面向对象编程中,您通过方法参数将数据传递给对象。在 React 中,您可以使用 props 将数据传递到组件中。

如果将参数传递给 Java 方法,则可以在方法体内更改这些数据。没问题。

在 React 中不可能,因为 props 是不可变的。

我看到的所有文献和资料都将这些不变性作为一个重要概念提到。但到目前为止,还没有人真正告诉我为什么

谁能告诉我:拥有不可变属性有什么好处?

或者分别是:没有不变性的最大缺点是什么?如果 props 是可变的,会发生什么?

最好作为一个很好的例子。那么我得到它的机会就更大了。

最佳答案

我会保持简短,因为我不是函数式编程方面的专家。我相信最终会有经验丰富得多的人加入。

首先考虑您的组件,而不是根据对象,而是作为函数(如数学术语)。 您的组件是其属性的函数。更具体地说,它是一个渲染函数。它接受 props 并返回 HTML(实际上它返回虚拟 dom 树,但这无关紧要)

数学中的函数是的。你给他们一个输入,他们给你一个输出。 它们没有副作用并且它们不使用任何其他输入。这会给您带来一些好处:

  1. 纯函数是可预测的。每个输入都会有完全相同的输出。可预测,意味着它们可以优化并利用内存之类的东西来缓存它们的结果,或者如果它们的 Prop 自以来没有改变,则不必渲染部分用户界面>你知道他们不会改变
  2. 仅根据给定的输入在出现问题时尝试调试时会有很大帮助,因为您无需担心全局状态。 您只需担心传递给您的属性
  3. 您不必担心纯函数的执行顺序,因为它们保证没有副作用
  4. 它提供了非常酷的开发者体验,例如时间旅行调试热插拔组件

这些只是一些好处,像我这样的普通开发人员可以看到。我相信具有真正函数式编程经验的人可以带来更多。希望对你有帮助

关于javascript - React - 拥有不可变 Prop 的最大好处是什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38672245/

相关文章:

javascript - 如何在 ReactJS 中导入 ActivityIndi​​catorIOS?

python3 : Using ternary operator in map, 它将返回 None

haskell - 为什么一个函数不能接受单子(monad)值并返回另一个单子(monad)值?

javascript - 删除数组中所有重复项和未定义项。 Ramda.js

javascript - 如何在Vue项目中导入Mozilla PDF.js?

javascript - 当文件类型匹配时,将 <a> 标签替换为 <audio tags>

Javascript - 无法从嵌套函数访问本地范围对象

javascript - 使用 JavaScript MV* 框架的原因?

node.js - 使用 ws 发送自定义事件

reactjs - 更新Reducer React Redux 中的嵌套状态