vue.js 同jquery 的比较

主题 
之前的项目都是用jQuery，为了某种目的，项目改用vue.js。谈谈vue.js同jquery的区别。

jquery

1. 官方定义：它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Ajax交互。
2. 我的理解：如同一个工具，为我们对HMTL的操作，提供了便利。
3. 工作：对jquery的使用，主要体现在三种方式上。 
   
   1. 对HTML的操作。如：$(“input”).addClass(“active”);等。
   2. 绑定事件。如：$(“button”).click(function(alert(“kkk”);));等。
   3. 请求数据。如：$.post(“url”,{},function(){});等。

4. 思考：从开发/维护 多角度分析jquery的使用。

   1. 开发 
      
      1. 更多是以事件为入口去处理HTML。
   2. 维护 
      
      1. 维护人员的思路：重现bug，观察bug是由于那个事件/初始化 触发之后，查找bind/on绑定事件的代码，步步跟踪，定位到错误的jquery操作处。
   3. 总结 
      
      1. 我们关注的不是一个页面整体。而是一次操作之后，页面的变化。
      2. 我们将更多的精力在于，HTML的操作上，样式的变化，增加一行数据的操作等。不同于vue.js关注的是数据。
      3. 我们更加依赖于HTML的页面，如果HTML发生了变动，jquery代码也随之变动。
      4. jquery体现在对HTML的细腻的操作。

   vue.js

   1. 官方定义：Vue.js是一个构建数据驱动的 web 界面的渐进式框架。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。
   2. 我的理解：用面向对象的角度，一个页面==一个类/组件，数据==属性，页面的效果==我属性（数据）的变化所引发的外在表现。
   3. 工作，我的思路流程 
      
      1. 先观察页面的功能定义，构造出属于它的数据。
      2. 需要事件触发，再编写起方法。方法是基本是数据的处理。
   4. 思考：vue.js 是否真的可以满足完全不需要对dom的操作。 
      
      1. 从目前项目进度来说，还真没有遇到需要对dom的操作。vue.js的语法基本能满足需求。
      2. 回忆之前jquery的开发方式，事件触发后，判断条件（或触发本身就是一个条件），条件true，操作html去改变样式等。如：checkbox无选中时，提交按钮disabled。其中，条件就是数据的判断。所以在vue中，该按钮是否disabled，关联于数据。
   5. 思考：开发/维护 的成本 
      
      1. 开发：个人比较喜欢vue，最后的js的代码量也不多。只要页面的业务逻辑没有大的变动，只是html的表现形式发生了变化，感觉vue的修改量要小点。
      2. 维护：不同于jquery，维护jquery只需找出事件的触发点，则可改动其方法则可。而vue则需维护人员关注于整个页面，对其功能的理解。

总结 
个人比较喜欢vue多点。维护jquery感觉有点累。