jquery作为风靡一时的js库,其优雅的链式写法和简单粗暴的操作方式——可以说在react和vue出来之前独霸天下。那么vue相比jquery的优势又在哪呢?
创新互联公司云计算的互联网服务提供商,拥有超过13年的服务器租用、达州托管服务器、云服务器、雅安服务器托管、网站系统开发经验,已先后获得国家工业和信息化部颁发的互联网数据中心业务许可证。专业提供云主机、雅安服务器托管、域名注册、VPS主机、云服务器、香港云服务器、免备案服务器等。
根据龙哥这么多年的使用经验:我得出得结论是各有千秋,比如jquery做效果很棒,vue解析数据渲染页面速度快,如果你做的是分离式开发,无疑你需要选择数据解析更强的vue,但是如果你做的是传统的mvc不分离开发,那么建议你选择jquery。这两者在思路上还是有所区别的,比如我们并不能用jquery操作dom的思维去写vue...
不要用jquery那种dom的思路放到vue中去操作。
vue本身是操作数据的,
例如说,做一个tab选项卡,如果是jquery,我们第一步会想,当前点的那个,从dom中jquery(“#name”)给他找出来,再运行function。
等于是你遍历了两遍dom。效率是非常低的。其实你应该想想,如果你这个操作,只是去比较一下两个数组,是不是效率最起码提高10倍??
可是这样再vue中是行不同的
你要想想,tab其实是一个数组,按照1,0,0,0去排列
1就是展开的那个,
你只要知道当前的active是哪一个就行了,然后判断tab按钮上的1和下面展示内容的1的位置是不是相等,就可以了。
在这个世界中,0和1,就可以创造万物,是最简单的东西创造万物,而不是每个万物都独立,所有一切的东西都有一个最简单的起源。这就是计算机。
一、主体不同
1、vue.js:是一套用于构建用户界面的渐进式JavaScript框架。
2、jquery:是一个快速、简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库。
二、特点不同
1、vue.js:Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,方便与第三方库或既有项目整合。
2、jquery:具有独特的链式语法和短小清晰的多功能接口;具有高效灵活的css选择器,并且可对CSS选择器进行扩展;拥有便捷的插件扩展机制和丰富的插件。
三、优势不同
1、vue.js:目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。
2、jquery:提供了对基本JavaScript结构的增强,比如元素迭代和数组处理等操作。
参考资料来源:百度百科-jQuery
参考资料来源:百度百科-Vue.js
vue所提倡的数据驱动视图和jQuery的直接操作DOM在编写页面时的思路是完全不同的。虽然两种思路是完全不同的,但也不能说是不能一起用的,在某些没有办法的情况下(例如需要操作dom的情况下),把jQuery和vue用在一块是完全没问题的,当然把这两种技术用在一起是肯定不会出现在最佳实践里的,因为确实没有特殊情况的话,这样用就是有点自找麻烦了。
以下是对传统jq与目前最热的vue进行的技术特性对比:
1、精力集中。
Jq偏重于对dom的操作,由它的函数就很容易看出来,$()、parent()、find()。我们用jq的时候经常要去考虑怎么去渲染数据,怎么从视图中取到数据,操作数据前必须对dom节点进行选取修改赋值等操作,这其实分散了我们的本该放在业务逻辑上的精力。而Vue则是基于MVVM思想,数据驱动,双向绑定,只需要定义好渲染规则,如果数据发生改变,vue会帮我们重新渲染整个页面,所以我们只需将注意力放在数据操作上就可以了。
2、代码结构。
如果你用jq没有好的代码架构,很容易就回出现一种情况就是:js里写着html元素代码,而且可能会遍布很多地方。因为增删改查你都需要对dom进行操作,这里甚至可能会写多了些冗余代码。代码架构好一点的,可能会写成一种简版框架(即有专门的渲染函数,增删改查都会调用这个函数),依然是全域的,需要闭包。而vue就没有这个问题方法全部写在methods中,提供多种钩子函数对页面渲染过成进行精准操作。
3、操作性。
用jq去操作dom实际上是蛮麻烦的。比如说又个对象数组已经渲染成表格了,这时你需要修改某一个id的那个对象的数据行,jq的话最麻烦的做法就是在遍历里面先拿到id,检查相等,相等的话,用index去拿到要改的那个dom,再重新渲染。而用vue的话,可以直接修改数据就可以了,而且你甚至可以用Array.map Array.filter ,方便快捷,提升开发效率
4、模块化。
目前无论前端还是后端开发,越来越倾向于模块化组件化,以求降低不同模块,不同功能区块之间的耦合度,便于后期业务的修改与拓展,vue完全cover上述特性,而使用jq的时候,如果你的js牛逼轰轰的写得已经超长了,然后你又觉得需要分下模块了,这时你有两选择,
1是用seajs,requirejs等,
2是用原生的import去管理你的代码。说实话,我没怎么用过requirejs去分模块,可能是我压根就想没到这些js要怎么分。
5、单页面实现。
单页面的实现原理估计大家都很熟了,一般是几个div在来回切换。如果一开始已经写好html,再来回切的话,html是太长了。如果用js去写又拼的很麻烦。如果你想用jq、原生实现页面切换,我能想到比较好的方式是用模版引擎...吗?但其实单页面的实现我感觉没那么简单,你不单单要考虑html能否单独写出来,还要考虑js需不需要按需加载,路由需不需要等等。。。用vue就不需要烦这些东西,vue自动构建单页应用,使用router模拟跳转。
6、组件的复用。
用vue最爽的莫过于使用别人写好的组件。目前vue的生态已经非常庞大,主流的组件库有element-ui,iview,使用主流的组件库不仅避免了我们重复造轮子,而且方便新员工快速接手项目,某个大神的组件总结:;app=news_articlegroup_id=6718405521088446988req_id=20190730093011010018026159736CF92,其实如果项目大的时候,有些组件(一些功能和视图的集合)可能会复用。这些相对于jq就是插件了,个人不喜欢script引入插件(任性)
7、性能。
vue使用了虚拟dom技术,能够减少 dom的操作,能提高一定的效率。