React框架:1、React简介

声明:本教程不收取任何费用,欢迎转载,尊重作者劳动成果,不得用于商业用途,侵权必究!!!

目录

一、前言

二、简介

1、组件化

三、专注视图层

四、虚拟dom

1、传统dom更新

2、虚拟dom

五、函数式编程


一、前言

创业公司不好招人,前段时间因为自己创业需要,我们决定在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开发环境

  • 3
    点赞
  • 13
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

被开发耽误的大厨

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值