译者：陈亮，安徽庐江人，无线专业方向硕士研究生。
审校：明明如月
jQuery通常被视为Web开发者入门的一个很好的切入点。
很多人在学习Vanilla Javascript(一个快速、轻量级、跨平台的JavaScript框架)之前都先学习了jQuery。
这是因为什么呢？
部分是因为jQuery非常流行，更多是因为许多经验丰富的开发者的一个错误认识的误导：
jQuery对他们而言很容易，那么它对初学者也应该同样很容易。
jQuery简洁却不简单
jQuery确实去掉了一些老浏览器存在的许多令人懊恼问题。
但是，它也并没有在DOM API或者Javascript的复杂性的封装上做更多的工作。
是的，我知道使用 $(‘#id’).click(function(event){...});
比在 Vanilla Javascript 中做这些事要方便许多。
但是你仍然需要去理解其它同事写的代码：DOM节点选择，事件处理，回调函数等等。
如果你已经学习并解过了DOM API ，而且掌握的很好，那么jQuery对你而言就非常容易的，
但这往往对初学者而言并不容易。
Vue.js
Vue.js是Javascript家庭的一个新成员。
在它的众多优势中，我认为它“易于学习”应该排在首位。
简单性贯穿它的设计始终。
我认为一个初学者使用Vue创建一个简单的应用，会比他们使用jQuery创建时，能更好地了解他们的代码是如何运作的。
下面，让我们分别使用jQuery和Vue.js来实现一个简单的应用，并对比他们的不同。这个应用将会统计按钮被点击的次数，并将其显示出来。
jQuery实现：
这里是使用jquery的一个典型实现：
从一个经验丰富的开发者的角度来看，这看起来非常简单。
但要理解这段代码在做什么是非常难的。因为你要考虑到：
1.通常在jQuery脚本中，你首先要输入的是
$(document).ready(function(){...});
在这30多个字符里，你会被以下四个概念所难住：DOM节点选择、事件处理、文档加载以及回调函数。
如果你不理解这些东西，那么你就很难理解你刚才写的这些代码。
2.获得一个DOM节点并使用它，你需要jQuery构造器 $(‘...’) ，然而不幸的是，你并不能准确地指定你将得到的节点。
你需要用一个类似于CSS3的选择器去创建一个合适的过滤器，而你将得到的节点将在它运行的时候才能决定。
为了做好这个，你需要在心里映射一个DOM副本，并模拟当你的过滤器工作的时候将会发生什么。
并且每当你重写了你的DOM结构，你都需要去更新你的DOM副本，并考虑它是否还会如预期那样起作用。
3.如果说有什么好的消息，那就是在jQuery里只有一种模式：选择一些元素，然后用API里的方法去处理被选择中的元素。
这个模式的问题在于，如果我们有一个一维平面API，内置了100个可以做从AJAX到数组迭代所有的事情的方法。
在这种情况下，我们不可能使用这么多足够的方法名去描述它们做什么以及返回什么。
祝愿初学者能够理解这些链式方法真正在做什么。
Vue.js实现：
下面是一个典型的Vue.js实现：
Vue考虑到很多使用jQuery的带来的痛点：
1.没有必要去关心DOM准备好的回调函数，这种复杂性已经被封装起来了。Vue的生命周期钩子将会允许对它的发生以及何时发生有更精确的控制。
2.在数据属性计数器和渲染他们的DOM节点之间，有一个明显的关联。
没有必要在心里记下DOM结构，你可以在页面上看到它，并且可以保证更新计数器的时候，不会因为不可靠的node选择带来不可预知的结果和你的DOM混在一起。
3.我们没有容易引起歧义的API方法供查询或者记住。
不同的功能由Vue构造器对象完美的组织起来，或者直接由模板中的DOM节点通过直接给他们更多的上下文以帮助理解。
包装
只有你真的对Javascript和DOM API 很了解，jQuery才算得上是容易的。这恰恰不适合初学者。jQuery并不简单，它只是一种简写。
从另一方面来说，Vue在设计过程中就将简单考虑进来了。很多DOM API的难点部分都被封装起来。初学者可以写出他们真正能够理解的代码，而且当他们需要做更复杂的事情的时候，也很适用。
所以，下一次有人问你，WEB开发的初学者应该先学什么的时候，
jQuery将不再是最佳答案。
参考：
vuejs中文网：http://cn.vuejs.org/
jquery官网 ： jquery.com