一、jQ只是一个库,Vue是个框架
jQ只是将原生代码封装成一个库,而Vue的实现比jQ复杂的多,而且Vue是框架,除了行为,还需要负责内容和样式。
二、jQuery是事件驱动,Vue.js是数据驱动
很多时候,使用jQ的代码就是给元素绑定一堆事件,就OK了。但是Vue.js是以数据变化为驱动,你的主要工作是改变数据。
三、jQ是程序员主要操作DOM,Vue是避免程序员操作DOM
jQ经常干的事情是把DOM的元素改来改去,变来变去,但是Vue的原则是最小化修改DOM,尽量只修改数据,Vue自己负责修改DOM。
四、jQ没有组件的概念,Vue的组件概念很重要
jQ认为它可以操纵全页面,所以任何一段html代码和一段css代码都不可能只属于某一段jq代码。而Vue则有组件的概念,一个组件文件,通常是一个.vue文件内,会有一段js,一段html,以及一段css。
五、jQ的大部分代码只是原生js的封装,Vue则复杂得多
jQ的大部分代码,比如选择器,比如.show()、.hide()、$.ajax()等等,有时候jQ一行能搞定的,原生JS三四行也能搞定,所以jQ主要是封装的作用。而Vue就不会让你这么简单的几行代码就搞定,因为Vue不是原生JS的行为封装。
所以如果只是比较两者实现弹出alert('OK')
谁的代码更简单,当然是jQ。
六、jQ是非响应式的,Vue是响应式的,这也是Vue的强大之处
比如一个外卖页面,用户选择了一个商品,那么,页面下方的总价位置,就要做对应的计算。如果是用jQ,你就需要去监听用户的点击操作,然后去修改页面下方显示的总价。然后根据配送费的不同,总价又会变来变去,你就要给用户的N种可能操作都要分别绑上事件,事件中都要处理页面最下方的总价的显示。然而,如果是用Vue,你不用关心有哪些位置显示总价,也不用关心哪些事件会影响总价,你只需要修改总价数据就可以了,所有显示总价的地方会自动更新。
七、jQ适合于交互简单的页面,Vue适合于交互复杂的页面
新闻网站的一个页面,复杂的JS不会多,因为用户主要是看字,点个赞。这时候jQ足够用。而APP性质的网站,或者SPA,也就是单页应用,这时候Vue的优势就凸显出来了,用jQ你很快就会绕进去,成为一团面条。
jQ擅长的方面是,行为和结果有一对一的关联,强调的是用户事件,比如用户点击赞,旁边的赞数就加1,除此之外没有别的。Vue擅长的是行为和结果多对多的关联,强调的是数据关联和响应,比如用户在外卖页面里点了一个菜,那么,购物车列表会计算一遍,总价会计算一遍,配送费会计算一遍,是否达到起送标准会计算一遍,是否达到某个代金券的适用范围会计算一遍,等等等等,当用户在外卖页面里把一个菜又追加了一份(点了一次加号),或者又减掉了一份(点了一次减号),又会引起一系列的计算,这时候如果用jQ,你需要为每一个计算都定义1个函数,最终定义N个函数,然后每1个函数可能都需要其他函数提供计算结果,而每个事件又可能调用多个函数,最终你会有一种要疯的感觉。
当然,如果APP性质的页面够简单、也不迭代,也可以考虑用jQ,因为用jQ写简单交互页面确实是快,几个事件绑定啪啪一写,就完事。但是,如果页面复杂,尤其是需要迭代,那么,花更多的时间、更大的精力来用Vue写,是值得的,如果用jQ,你会发现一点功能的修改就要牵扯百分之八十的jQ事件的代码,你要挨个改,会疯掉。
网友评论