React常见问题

1. 为什么选择React

2. JavaScript 中如何写JSX ?浏览器是如何识别它?

JSX 只是一种 Facebook 普及的标记语法，可以在Javascript中直接书写html，而不用一个的DOM对象。采用JSX，就会有一个编译的过程。将HTML写的DOM翻译成js的对象。

为什么会有中间这一层？

• 原因之一：我们拿到一个UI表示的对象之后，不一定会把它就在渲染在普通的页面上，我们可能会把它渲染到一个canvas（react-canvas）上，或者手机app（react-native）上。这也是为什么要把react-dom单独抽离（而不是包括在react中）的原因。

• 原因之二：有了这样一个对象之后，就可以在数据改变需要重新渲染对象的时候，用比较快的算法来操作js对象（避免直接操作页面上的DOM），这样可以减少浏览器重排，极大的优化性能。

JSX仅仅提供React.createElement(component,props, ...children)函数这样的语法糖. 当一个元素是小写开头的时候，一般被引用为内建组件，比如<div>或者<span>，会给React.createElement传入一个字符串div或者span，而大写字母开头的组件比如：<Foo />会编译成React.createElement(Foo)并且和组件定义联系起来。<myComp>会报错。

你能解释下“状态提升”理念吗？

“它允许你在兄弟组件间传递数据”或“它允许你拥有更多纯展示组件，更易复用”

如果不能在组件间传递数据，你怎样给多级组件传递数据？

自从 React 16.3 开始，Context 已经成为主流（function-as-child 模式）， 如果这里能提到 Redux 或 MobX 也很好。简单说就是，当你不想在组件树中通过逐层传递props或者state的方式来传递数据时，可以使用Context来实现跨层级的组件数据传递.

Context的使用基于生产者消费者模式.对于父组件，也就是Context生产者(Provider),子组件是消费者Consumer

 

小型的代码挑战

参https://blog.csdn.net/sinat_17775997/article/details/83830796