react的基础概念

什么是React？

1. 声明式开发
2. 可以与其他框架并存
3. 组件化
4. 单向数据流（state 为局部的或是封装的的原因）
5. 视图层框架
6. 函数式编程

---

Recat的视图与数据交互原理是什么？

• 当组件的state或者props发生变化的时候，render函数就会重新执行
• 当父组件的render函数被运行时，它的子组件的render都将被重新运行一次

---

相对于每个组件，其对应的的生命周期函数？

1. 组件模板挂载过程（Mounting）：

• [1] componentWillMount函数是在组件即将被挂载到页面的时刻自动执行
• [2] render函数是组件正在挂载的时候，自动被执行
• [3] componentDidMount函数是组件被挂载到页面之后，自动被执行

2. 组件模板数据更新过程（Updation）：

• props数据更新过程：

• [1] componentWillReceiveProps函数是当一个组件从父组件接受参数；如果这个组件第一次存在于父组件中，不会执行；如果这个组件之前已经存在于父组件中，才会执行（只要父组件的render函数被重新执行了，子组件的这个生命周期函数就会被执行。）
• [2] shouldComponentUpdate函数是组件被更新之前，它会自动被执行，用于判断组件是否执行更新操作，必须返回一个boolean值
• [3] componentWillUpdate函数是组件被更新之前，它会自动执行，但是它在shouldComponentUpdate之后被执行，如果shouldComponentUpdate返回true它才执行；如果返回false，这个函数就不会被执行
• [4] render函数是组件正在更新的时候，自动被执行
• [5] componentDidUpdate函数是组价更新完成之后，它会被执行

• state数据更新过程：

• [1] shouldComponentUpdate函数是组件被更新之前，它会自动被执行，用于判断组件是否执行更新操作，必须放回一个boolean值
• [2] componentWillUpdate函数是组件被更新之前，它会自动执行，但是它在shouldComponentUpdate之后被执行，如果shouldComponentUpdate返回true它才执行；如果返回false，这个函数就不会被执行
• [3] render函数是组件正在更新的时候，自动被执行
• [4] componentDidUpdate函数是组价更新完成之后，它会被执行

3. 组件模板删除过程（Unmounting）：

componentWillUnmount函数是当这个组件即将从页面中被剔除的时候，会被执行

---

react的性能优化有何方法？

• 将方法需要用到的this指针的作用域写在constructor函数中。这样做的话，this指针的作用域只需要初始化操作一次，就可以在整个组件中使用，可以避免组件的无谓渲染
• setState内置了异步操作方法，可以把多次数据改变结合成一次来操作，降低虚拟DOM的比对频率，使得性能得以提升
• react的底层用到了“虚拟DOM的概念”、“同层比对”以及“key值的概念”，来提升DOM比对的速度，从而提升react的性能
• 借助shouldComponentUpdate函数来避免无谓的组件（一般指的是子组件）的render函数的执行，从而来提高react的性能。

列表的key值如何设置？

一个好的经验法则是：在 map() 方法中的元素需要设置 key 属性。

1. key 只是在兄弟节点之间必须唯一
2. key 会传递信息给 React ，但不会传递给你的组件。