ReactJs|ReactJs 深入介绍

开篇首先吹嘘一下reactjs到底有多火。

reactjs在github上面创建的时间是在2013年5月,在中国市场开始有人接触大概在2014年7月左右,火起来大概在2015年左右,之后就一发不可收拾,到我写这篇文章之时已经收获了41260个star,网络上铺天盖地的求助贴,"到底要不要用reactjs"。
到底要不要用取决于很多方面的因素:
一方面自身:如果你是个全栈,如果你不满足于写写UI,如果你想接触一个全新的js思想领域,那么不要犹豫了。react开发团队,从2015年就开推出了react-native(一个可以在android,ios,uwp设备上运行的框架,接近native的性能,js的开发效率,相同经验的人使用react-native开发效率上有三倍以上!)
一方面公司团队:如果你们开启一个新的项目,完全可以先调研,并尝试一下。如果是一个老的项目,但要开发一个新的模块,也可用尝试一下reactjs。和大部分js框架都没啥冲突。
其次吹嘘一下reactjs到底有多牛:
reactjs的开发团队是facebook的天才全栈们,是一个叫Jordan Walke首先提出的(名字的什么不重要),reactjs的灵感来自php的html扩展xhp。火起来之后,facebook又用这种模式开发了react-native,并在2015开发者大会上宣布开源,号称:Learn Once,Write Anywhere!
react有系列配套库,react-redux(数据交互),react-router(路由),react-canvas(高性能绘制)等,目前我所在的这家公司接下来的先之平台也采用reactjs来写。
react的原理:
react有几个核心点:单向数据流,虚拟DOM树,JSX语法
ReactJs|ReactJs 深入介绍
文章图片
react应用中,后台维护一颗dom树,程序大多情况下操作的都是virtual dom树,而由virtual dom树负责浏览器页面的更新。
处理流程是 程序中更改react state -> 通知virtual dom ->检查是否需要更新virtual dom树 ->如果需要则局部更新dom树 -> 改变浏览器数据显示。
单向数据流:就是上面的处理流程
virtual dom:virtual dom实际上就是一份存储在内存中的数据结构,相比真是dom虚拟dom处理的速度更快,因为js的运算速度快,同时react会对dom的操作做优化,会对数据变化做diff。
jsx语法:在js中写html代码,前端的福音,再也不用记各种id和class名了。
reacjs 的项目建立流程:
初始化npm项目 -> 建立配置webpack/gulp ->安装必备npm工具和react库->开始编写代码。
【ReactJs|ReactJs 深入介绍】项目配置文件等请参照本博客其它内容。

    推荐阅读