React概念：純度

純度是什麼，純函數和純組件是什麼

在JavaScript中，如果一個函數不改變對象，而只是返回一個新的對象，則稱為純函數。

一個函數，或者一個方法，要被稱為純，不能引起副作用，在使用相同的輸入多次調用時應該返回相同的輸出。

純函數接收輸入並返回輸出，不改變輸入或其他任何東西。

它的輸出僅由參數決定。你可以對這個函數調用100萬次，並給定相同的參數，輸出始終是相同的。

React將這個概念應用到組件上。當組件的輸出僅依賴於它的props時，它被稱為純組件。

所有的函數組件都是純組件：

1
2
3

const Button = props => {
 return <button>{props.message}</button>
}

如果類組件的輸出僅依賴於props，它也可以是純組件：

class Button extends React.Component {
 render() {
 return <button>{this.props.message}</button>
 }
}

tags: [“purity”, “functional components”, “class components”]