一、前言

创业公司不好招人，前段时间因为自己创业需要，我们决定在Vue、React、Angular中选一款框架先自己研究一下，

因为本人java、android开发出身，根据自己多年的经验：Android较多的是WebView调用前端代码、还有自己在联想做的一个Android+ Cordova+ vue / Sencha Touch（第一个基于HTML5的Mobile App框架）的项目等等

上学那会学过javaEE服务器开发像 html+css+js、ajax、jQuery、Mybatis、ssh 框架等都有学过，而又React较其他二个框架更偏向于移动端，

临时决定让我研究一下React，所以过了一遍以前前端的基础笔记、学习了一下React，在此做个记录吧！在学习一项新技术我一般这么做：

1、去找一个学习流程图。

2、学习基础，如：变量怎么定义、条件语句、循环语句、值怎么传递等，其实其他技术都是这样的套路开始。

3、然后根据流程图着重去研究某一块，到时候项目需要那块就去研究，这样你会用了。

4、进阶的话就是要多采坑、多做项目、多总结，这时候你遇到项目快速会用、做的东西更稳定

5、高级的话经验丰富了，就会想为什么这么实现？

就会去了解背后原理怎么实现的！因为他们遇到项目需要搭建框架、技术选型、保证性能等。

好了其他不多说了，这个是花了一段时间找资料、找学习视频研究了一下的笔记整理！

二、简介

对于前端来讲，最浪费性能的就是DOM操作，虚拟DOM帮我们减少了操作的次数，从而使我们提高了性能。

JSX是一个非常创造性的语法，它相当于允许在JS里面直接写html代码，而不像过去需要通过字符串拼接出来。

1、组件化

它把所有功能模块、UI等抽象成一个个单独的组件，在进行页面制作只需要把n个组件进行排列组合，就能够制作我们需要的页面效果。

数据流的流动方向是固定的，都是从父到子、从上到下的方向，这样使我们的整个代码逻辑比较清晰，方便我们阅读理解以及将来的维护。

三、专注视图层

四、虚拟dom

1、传统dom更新

2、虚拟dom

相当于JS代码和真实DOM之间加了一个虚拟DOM，那么我们的JS想要操作DOM的时候怎么操作？

它并不是直接操作DOM，而是操作跟真实DOM一样的JS变量，那么这个JS变量它跟真实DOM树的树形结构是一模一样的，

但是它的本质是一个JS变量，那么我们代码去操作虚拟DOM，虚拟DOM由于它是JS变量，所以操作效率是非常高的。

那么我们的App可以n次操作虚拟DOM，然后由虚拟DOM一次性反应到我们的真实DOM里面，

那么这样我们就把过去n次真实DOM的操作，缩减为1次，从而尽大可能的提高了我们页面的呈现效率，避免了性能的浪费。

五、函数式编程

请别只做拿来主义者，如果觉得写的不错、对你有用，留下你的足迹：点赞或评论支持下！

一直被模仿从未被超越，你们的支持是我们这些写博客博主们的动力！我们将继续分享干货！

下一篇文章：React框架：2、搭建React开发环境

React框架：1、React简介相关推荐

（React 框架）React技术
1.简介 React 是Facebook 开发并开源的前端框架当时他们的团队在市面上没找到合适的MVC 框架,就自己写一个 JS 框架,用来架设 instagram(图片分享社交网路),2013年开 ...
从0实现react框架，React Fiber架构和Fiber Diff算法
react框架是目前最为流行的前端框架之一,尤其在很多大厂,应用更为广泛.相对于一些mvvm框架,react上手需要一定的技术基础,但掌握后,编码体验和性能是很不错的.react整体思想是函数式编程, ...
采用React框架搭建项目
使用vue框架也做了很多项目,基本的需求业务逻辑都没可满足,可是依然对框架内部工作原理不是很熟悉,只是套用一些指令方法去应用,做开发越接近本质收入越大. 原生的一些写法可能已经很过时了,但是仍然要熟悉 ...
【React框架基础知识】React框架的简介与基本使用方法
一.简介 React:由Facebook开发的用于构建用户界面的JavaScript库(开源). 1.1 为什么要学前端框架? 原生Javascript有很多痛点: 原生JavaScript操作DOM ...
React框架简介（JSX语法、组件、虚拟DOM渲染）
目录 React框架为什么要学习React React特点 React核心 JSX语法语法详解 React开发过程实际DOM 虚拟DOM React组件函数组件类组件虚拟DOM渲染过程 R ...
react jquery_2019年React简介（面向仅了解jQuery的人们）
react jquery by Julien Benchetrit 通过朱利安·贝肯特里特 2019年React简介(面向仅了解jQuery的人们) (An Introduction to React ...
九：以理论结合实践方式梳理前端 React 框架 ——— 简述中间件
redux-saga 基本简介中间件是一种独立运行于各个框架之间的代码,以函数的形式存在,连接在一起,形成一个异步队列,可以访问请求对象和响应对象,可以对请求进行拦截处理,再将处理后的控制权向下传递 ...
React入门第一弹——为什么国内大厂更钟爱react框架？
React 入门 React简介为何国内大厂更多使用React? React是Facebook用来创建用户界面的JS库,在2013年开源的.React不是一个MVC框架,而是一个用于构建组件化UI的 ...
十：以理论结合实践方式梳理前端 React 框架 ———集成框架
dva 框架简介 dva 首先是一个基于 redux 和 redux-saga 的数据流方案,然后为了简化开发体验,dva 还额外内置了 react-router 和 fetch,所以也可以理解为一个 ...

React框架：1、React简介