认识React，了解React

2021-09-16 11:58:58 阅读：167 来源： 互联网

一、React简介

1、React是一个用于构建用户界面的JavaScript库。
2、React起源于Facebook的内部项目，用来建设Instagram的网站
3、React不是一个完整的MVC框架，最多可认为是MVC中的V（View）
4、React是构建用于可重复调用的web组件，侧重于UI，也就是View层
5、React拥有较高的性能，代码逻辑非常简单
6、React是单向的从数据到视图的渲染，非双向数据绑定

二、React的特点

1、声明式设计：

1)、命令式开发：原生js和jq写代码的时候，大部分都是在操作DOM，这种开发模式就是命令式开发。
2)、声明式开发：react是面向数据编程，不需要直接去控制dom，你只要把数据操作好，react自己回去帮你操作dom，可以节省很多操作dom的代码，这就是声明式开发。

2、可以与其他框架并存（灵活）

react所控制的dom就是id为root的dom，页面上的其他dom元素也可以使用jq等其他框架。

3、高效（虚拟DOM，高效速度快，跨浏览器兼容）

1）react操作的是Virtual DOM （虚拟dom），最大限度地减少与dom的交互
2）虚拟dom：Virtual DOM 顾名思义不是真实的DOM，它不需要浏览器的DOM API支持。虚拟DOM是在DOM的基础上建立一个抽象层，其实质是一个JavaScript对象，当数据和状态发生了变化，都会被自动高效的同步到虚拟DOM中，最后再将仅变化的部分同步到DOM中。

4、组件化

通过 React 构建组件，使得代码更加容易得到复用，能够很好的应用在大项目的开发中。

5、单向数据流

React 实现了单向响应的数据流，从而减少了重复代码，这也是它为什么比传统数据绑定更简单。
1）react是单向数据流，父组件传递给子组件的数据，子组件能够使用，但是不能直接通过this.props修改，会报错（cannot assign to read only property ‘xxx’ of object ‘#object’）
2）子组件要传值给父组件，或者要修改父组件的代码，都要通过父组件传递过来的方法去实现
3）这样的好处在于，让数据清晰代码容易维护。

6、react是视图层框架

如果是大型项目，非常多的子组件，要修改一个公共的参数，就需要很多层的传递才能完成一个数据变更。
单单react去做大型项目是不够的，他优势在于视图层的渲染，涉及到复杂的数据传递，还需要结合其他数据层的框架开发。如mox-box，redux。

7、函数式编程

react项目中大部分都是函数，连html都是由render函数去实现的。
他的优势在于，方便代码维护，复杂的函数可以拆分成多个函数。
在前端自动化测试是也很方便，只需要给函数一个参数，看他输出就可以了。

8、JSX

JSX是JavaScript语法的扩展。
react使用JSX来替代常规的JavaScript。
JSX是一个看起来很像XML的JavaScript语法扩展。
JSX的优点：
	1.JSX执行更快，因为它在编译为JavaScript代码后进行了优化。
	2.它是类型安全的，在编译过程中就能发现问题。
	3.使用JSX编写模板更加简单快速。

标签：react,dom,认识,DOM,React,了解,组件,JSX
来源： https://blog.csdn.net/weixin_43959024/article/details/120324275

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9