react native react( 四 )


使用jsx语法会使react开发更为简单,xml指的只是借鉴了一些XML的语法,标签必须闭合,最外层必须有节点包裹
jsx语法需要编译成React.createElement
2.虚拟dom
React会在js中根据组件的虚拟dom结构来构建出完整的一套虚拟DOMapi,每一次的数据变化React都会重新构建一套完整的虚拟DOM和上一次的虚拟DOM利用DIFF算法计算出不同的地方,重新渲染,因为所有的操作都是在虚拟DOM中,很大程度避免了操作真实DOM,所以性能极高,且React还能将两次连续的数据变化合并到一起
注意:react如何创建虚拟dom,diff算法如何进行对比
3.单向数据流
其实reactjs的核心内容就是数据绑定,所谓数据绑定指的是只要将一些服务端的数据和前端页面绑定好,开发者只关注实现业务就行了
单向数据流:只要服务端数据发生变动,前端数据也变动
4.组件化开发
React的组件化开发是体现其高效率的地方
组件其实就是html,js,css,image等部分的聚合体,页面结构中独立的功能部分
组件应该拥有的性质:
(1)可组合(Composeable):一个组件易于和其它组件一起使用,或者嵌套在另一个组件内部 。如果一个组件内部创建了另一个组件,那么说父组件拥有(own)它创建的子组件,通过这个特性,一个复杂的UI可以拆分成多个简单的UI组件; (2)可重用(Reusable):每个组件都是具有独立功能的,它可以被使用在多个UI场景; (3)可维护(Maintainable):每个小的组件仅仅包含自身的逻辑,更容易被理解和维护 (4)可测试(Testable):因为每个组件都是独立的,那么对于各个组件分别测试显然要比对于整个UI进行测试容易的多 。
划分组件的原则: 复用率高的,逻辑较为独立的
5. React核心对象
react.js中React,react-dom.js中有一个ReactDOM
6 React的样式和事件
R推荐使用行内样式,这样就可以更大程度保护组件的独立性,事件也需要通过行内设置的方法来设置
7 React组件的props和state
R数据的挂载主要依靠props和state;1.属性(props)在组件外部传入,或者内部设置,组件内部通过this.props获得2.状态(state)在组件内部设置或者更改,组件内部通过this.state获得相似点:都是纯js对象,都会触发render更新,都具有确定性(状态/属性相同,结果相同)不同点:属性能从父组件获取,状态不能属性可以由父组件修改,状态不能属性能在内部设置默认值 ,状态也可以属性不在组件内部修改,状态要改属性能设置子组件初始值,状态不可以属性可以修改子组件的值,状态不可以状态只和自己相关,由自己维护属性不要自己修改,可以从父组件获取,也可以给子组件设置组件在运行时自己需要修改的数据其实就是状态而已
8 ref
组件可以在renderdom结构中通过ref对dom、子组件进行标记,在组件里通过this.refs来获取,就可以操作真实DOM和调用子组件的属性方法
9.生命周期
10.组件通信

秒懂生活扩展阅读