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,使用主流的组件库不仅避免了我们重复造轮子,而且方便新员工快速接手项目,某个大神的组件总结:https://www.toutiao.com/i6718405521088446988/?timestamp=1564450212&app=news_article&group_id=6718405521088446988&req_id=20190730093011010018026159736CF92,其实如果你项目大的时候,有些组件(一些功能和视图的集合)可能会复用。这些相对于jq就是插件了,个人不喜欢script引入插件(任性)

7、性能。

vue使用了虚拟dom技术,能够减少 dom的操作,能提高一定的效率。

jQuery和Vue的技术优劣对比的更多相关文章

  1. php开发面试题---jquery和vue对比(整理)

    php开发面试题---jquery和vue对比(整理) 一.总结 一句话总结: jquery的本质是更方便的选取和操作DOM对象,vue的本质是数据和页面分离 反思的回顾非常有用,因为决定了我的方向和 ...

  2. jquery和vue对比

    1.jquery介绍:想必大家都用过jquery吧,这个曾经也是现在依然最流行的web前端js库,可是现在无论是国内还是国外他的使用率正在渐渐被其他的js库所代替,随着浏览器厂商对HTML5规范统一遵 ...

  3. jQuery到Vue的迁移之路

    背景 在前段时间做了L10的某个超复杂超多坑的三端专题之后,组里的小伙伴们一致认为是时候想办法统一一下组里的开发模式了.因为用nie那一套jQuery/zepto(下文jQuery默认包括zepto) ...

  4. python工业互联网应用实战18—前后端分离模式之jquery vs vue

    前面我们分三章来说明了使用django template与jquery的差别,通过jquery如何来实现前后端的分离,同时再9章节使用vue.js 我们浅尝辄止的介绍了JQuery到vue的切换,由于 ...

  5. Vue和React的对比

    今晚我们来搞一搞Vue和React的对比好吧,话不多说今天我们直接开搞可好,各位小老板,开始吧 1. react整体是函数式的思想,把组件设计成纯组件,状态和逻辑通过参数传入, 所以在react中,是 ...

  6. 微信小程序与传统APP十大优劣对比

    随着微信公众平台的开放,微信端小程序涌现市场,带来很很多便利和简单的原生操作,询:微信端小程序是否会替代传统的APP应用?两者的优劣如何?我们一起来看看传统APP与微信端小程序十大优劣对比       ...

  7. queue与topic的技术特点对比

    1    queue与topic的技术特点对比 Topic Queue 概要 Publish Subscribe messaging 发布订阅消息 Point-to-Point 点对点 有无状态 to ...

  8. jQuery和Vue的区别

    1.jQuery和Vue的区别 jQuery是使用选择器($)选取DOM对象,对其进行赋值.取值.事件绑定等操作,其实和原生的HTML的区别只在于可以更方便的选取和操作DOM对象,而数据和界面是在一起 ...

  9. jquery的几种ajax方式对比

    jquery的几种ajax方式对比 jquery的ajax方式有如下几种: 1.   $.post(url,params,callback); 2.   $.getJSON(url,params,ca ...

随机推荐

  1. 分布式图数据库 Nebula Graph 的 Index 实践

    导读 索引是数据库系统中不可或缺的一个功能,数据库索引好比是书的目录,能加快数据库的查询速度,其实质是数据库管理系统中一个排序的数据结构.不同的数据库系统有不同的排序结构,目前常见的索引实现类型如 B ...

  2. 【JDK】JDK源码分析-HashMap(2)

    前文「JDK源码分析-HashMap(1)」分析了 HashMap 的内部结构和主要方法的实现原理.但是,面试中通常还会问到很多其他的问题,本文简要分析下常见的一些问题. 这里再贴一下 HashMap ...

  3. Core + Vue 后台管理基础框架4——前端授权

    1.前言 上篇,我们讲了后端的授权.与后端不同,前端主要是通过功能入口如菜单.按钮的显隐来控制授权的.具体来讲,就是根据指定用户的制定权限来加载对应侧边栏菜单和页面内的功能按钮.我们一个个来讲. 2. ...

  4. 附014.Kubernetes Prometheus+Grafana+EFK+Kibana+Glusterfs整合解决方案

    一 glusterfs存储集群部署 注意:以下为简略步骤,详情参考<附009.Kubernetes永久存储之GlusterFS独立部署>. 1.1 架构示意 略 1.2 相关规划 主机 I ...

  5. can do / will do / should do 情态动词

    can do = be able to do will do = be going to do should do = ought to do 情态动词 都是表示建议 从这里发现 to do (不确定 ...

  6. Python习题集(四)

    每天一习题,提升Python不是问题!!有更简洁的写法请评论告知我! https://www.cnblogs.com/poloyy/category/1676599.html 题目 如果一个 3 位数 ...

  7. 【分布式锁】04-使用Redisson实现ReadWriteLock原理

    前言 关于读写锁,大家应该都了解JDK中的ReadWriteLock, 当然Redisson也有读写锁的实现. 所谓读写锁,就是多个客户端同时加读锁,是不会互斥的,多个客户端可以同时加这个读锁,读锁和 ...

  8. Lambda表达式学习笔记

    Lambda基础语法 Java8中引入了一个新的操作符" -> ",该操作符被称为箭头操作符或Lambda操作符,箭头操作符将Lambda表达式拆分成两部分: 左侧:Lamb ...

  9. VsCode代码段添加方法

    VsCode代码段添加方法 我们在编写代码的过程中,常常会遇到一些固定的结构或常用的处理方法. 编写耗费时间尽力,这时我们想到了添加代码段功能,帮助我们快速的完成编写. 下面以VsCode为例子: 我 ...

  10. Effective Python读书笔记

    有些位置可能翻译理解的不到位,各位看官如有疑问,欢迎留言赐教. Pythonic Thinking 大家经常用Pythonic来形容python语法风格的编程方式:简单优美,没有之一:通过import ...