如何在主流JavaScript框架中做选择？横向对比Vue, React, AngularJS, and Angular2

一个有趣的事实是：IBM发表的2017年最值得学习编程语言名单中，JavaScript榜上有名。正是这位IT巨头指出，JS在网站中惊人地达到94.4％的使用率，而且“不太可能降低”。JavaScript能确保“对用户非常友好的网页，因为它负责整个web界面，包括动画和交互”。不管你怎么看，JavaScript很重要。

这也指明了潜在Web开发人员的方向：如果你深入前端，你不得不在某些时刻面对JavaScript。并且正确的开发指南可能有助于此。

让我们假设你知道JavaScript基础知识。纯JS（不是一无所知）的那种。如果假设是正确的（意思是你了解基础），你可能对现代JavaScript框架们的学习更感兴趣。这些框架通常带有预置的函数和一些构建应用的方法。

JavaScript Frameworks

有些人可能会有局限性的思考，认为世界上大多数开发者更喜欢使用框架（不要将它们与库混淆），因为它们使工作更容易，更快速，在通常情况下更可靠。

好吧！说完这些，是时候该深挖一点儿了。

我们的开发团队准备了他们每天使用的框架清单。虽然周围肯定有更多的JavaScript框架，这些是我们最关注的。

接下来，你会看到我们所爱的技术及其各自特点的简单概述。

大街上的酷小孩－Vue.js。

Vue.js JavaScript framework

这个就像一个还在读高中的超级巨星。它不是一个成熟的技术，所以我们真的无法说，五年后，Vue会发生什么。然而目前，它可能是每个会议议程中最引人注目的话题。

如果你决定和JS极客喝两杯，他会谈论Vue。如果Vue是个流行歌星，那么现在它就是最红的。如果...嗯，你明白我的意思。

它由尤雨溪在2014年2月建立。在2016年，Vue.js拥有惊人的89％的开发人员满意度评估，目前是GitHub中star最多的项目之一。

虚的说差不多了，来点实际的。什么是Vue.js？首先，它是本文中讨论的所有JavaScript框架中最快最小的。它的语法和原理所需要的学习成本不是很高。此外，它还具有高覆盖率的文档。你想要执行的操作绝大部分情况已被记录在案。此外，如果一个操作没有文档记录，你能在线上找到解决方案的几率很小，因为Vue不如Angular或React更流行。

注意：Vue的发音和“view”一样。

随便挑5个Vue.js的特性说一下：

• 便于扩展的插件系统。

• 拥有在使用服务端渲染时的库(Nuxt.js)。

• 支持范围样式。

• 有一个CLI工具，允许你通过先进的前端工作流设置，快速构建单页应用。

• 被加入Laravel5.4的新特性中，用来处理前端模板

就像React一样，Vue.js仅处理视图层。也就是，它让开发人员自己实现他们的业务逻辑。它也有被称为Flux架构实现的Vuex。作为我们的队友，36Kr某员工说：

在我看来，Vuex比React的Redux使用起来更好，更容易。

此外，Vue.js在Chrome中拥有最好的开发者工具，并且Weex也使用Vue的语法，它是一个通过JavaScript构建原生应用的框架，也是React Native的竞争对手。值得注意的是，Weex并不太完善，特别是对于商业项目。目前，它更多的是一个方案而不是一个真正的技术。

对开发者来说，Vue.js的优势在于：

• 易于学习和理解，能快速开发应用

• 与Laravel集成，所以具有Vue知识的开发人员对使用Laravel开发应用的后端团队有所补充

• 拥有非常方便的CLI工具，可以快速启动

• 有很多额外的模块，如路由器和状态管理工具；虽然不如其他框架那么多

对客户来说，Vue.js的优势在于：

• 降低前端应用成本，乃至全功能web应用的成本（在使用Laravel和Vue.js的组合时）

• 在保证稳定性的同时，是一个快速可靠的解决方案

• 较小的模块很适用，如日历，联系人表单或小部件

开发者满意度最高－React.js

React.js JavaScript framework

React是由Facebook的Jordan Walke创建的，GitHub的最流行框架中排名第5。然而，React.js（以及React Native）最火爆的时间点是在2015年。

据State of JS调查显示React的开发者满意度最高，达到92％。Vue跟它在同一个级别。根据调查，React的开发者较平均水平来说，在决定哪个技术配套使用前，会尝试多种其他技术组合。

随便挑5个React.js的特性说一下：

• 框架只负责"View"层，这意味着其它业务逻辑是完全解耦的，并且能以任何方式来实现。

• 与框架相关的Redux是一个非常棒的类Flux架构的实现。

• 模板方面，框架可以使用JSX语法，这个语法在刚上手时可能会有一点点难度。

• 开发者掌握React.js的知识后，可以直接用于基于React Native的移动客户端开发。

React对VirtualDOM的使用，以及由此获得的高性能广受开发者好评。经常使用框架的开发者也是这与这项技术相关的庞大社群的重要组成部分。React的快速发展，除了 Facebook的维护外，也要感谢开源项目以及第三方的模块。

此外，随着React将会有一个能够向后兼容的重写版React Fiber的消息放出，React的"第二春"很快就会到来。

对开发者来说，React的优势在于：

• 庞大且活跃的社区

• 并非一个大而全的框架

• JSX这种新的JavaScript语法，也是一个不错的优点

• 相关的开发工具也很不错

• 强制使用最新的最佳实践

对客户来说，React的优势在于：

• 大量的开发者熟悉这个框架

• React Native使得Web应用的逻辑可以复用于移动客户端

• 有足够多的使用和测试场景来保证框架本身几乎没有bug和错误

智慧长老－AngularJS

AngularJS JavaScript framework

Google在2009年第一次发布了AngularJs框架，鼓励使用声明式编程方法去创建用户界面和连接各种组件，另一方面，指令式的编程用于实现程序的逻辑。

Brat Tech公司的Miško Hevery是这个技术的真正作者，当时，它被创建为在线JSON存储服务背后的软件。但是业务没有搞起来，所以公司放弃了这个想法，并将AngularJs作为一个开源库发布。

AngularJS使用双向数据绑定的方式，适配和扩展了传统的HTML来呈现动态内容。

所有这些可能听起来很有意思，事实是AngularJs已经有点老了
实际上。它是我们描述的框架里最老的了，大ReactJS4岁，Vue.js5岁，比Angular2年长了7岁之多。

尽管如此，他拥有Github上最多的贡献者(1,562个)，随后是ReactJS，Angular2，Vue.js。

不可否认，AngularJS有一个陡峭的学习曲线，这个缺点在某种程度上被一个大型社区抵消，保证开发人员可能遇到的大多数问题存在解决方案。

随便说AngularJS的5个特性

• 仍然有许多项目使用AngularJS，所以了解AngularJS方便你维护这些项目。

• 为不想使用新的Angular或Ember.js的团队提供可行且稳定的解决方案。

• 使用脏值检查（digest cycle）；与观察者模式相比孰优孰劣取决于你的需求。

• PlayStation 3上的YouTube应用是用AngularJS开发的。

• 以HTML为中心。

AngularJS是SPA中最常用的JavaScript框架之一，也是企业级应用的一个很好的选择。但是它确实很老了，大多时候是被老旧的应用采用。

AngularJs对开发者来说的"优"点：

• 在2017年，如果你还没有使用它，你完全可以忽略他了。

• 如果您需要更多功能的话，请使用新的Angular或Ember。

AngularJS对用户来说的"优"点：

• 主要维护尚未准备好或无法获得足够重写的旧应用。

• 由于框架复杂性，创建更复杂应用的成本很高。

译者注：各种黑，我X

Angular2（或简称Angular）

尽管在不挖掘源代码的前提下，很难完全了解Angular2的概念，它是一个非常强大的框架 内置了相当多的功能。

以AngularJS为基础，使用Typescript重写。与以前的版本相比，它没有scope或controllers的概念。相反，它使用组件层次结构化作为其主要架构概念。支持动态加载，改进了依赖注入，并提供更为简单的路由和异步模板编译机制。

随便说Angular2的5个特性

• 由TypeScript编写，允许开发人员使用TypeScript，Dart或纯粹的ECMAScript。

• 组件的模式利用了TS类和装饰器。

• 陡峭的学习曲线

• 开发过程很快。

• 高级的的测试特性。

基本上，Angular可以摆脱AngularJS中存在的不必要的复杂性。然而，许多人认为，即使用CLI，单个开发人员的配置和启动过程仍然可能太长。

我们的开发团队也不太喜欢提供文档，特别是对于JS和Dart。另一方面，他们又喜欢将技术分解成很多模块。

Angular对开发者的优点：

• 你喜欢TypeScript就开心了

• 强制规定编写代码的方式，使得它成为与多个开发人员合作的好选择

• 使用同一个库开发移动和桌面应用

• 对于具有很多代码的单页应用是个不错的解决方案

Angular对客户来说的优点：

• 使用该框架构建企业应用可能会降低成本

• 大量开发人员已经知道如何使用框架

有最好的 Javascript 框架这一说么?

想要一个简单的答案? 没有。这跟公司目标、需求、以及最终的功能都有关系。举例来说，Angular2更像是一个百宝箱，特别适合大型项目。它非常复杂，并且需要花很多时间来全面的学习和掌握（但比AngularJS要简单一些）。但使用以JavaScript为核心的React，开发者就能快速高效得拼凑出一些有用的东西。

每个框架都在以不同的方式尝试适合用于不同场景的Web应用开发，包括MVP、创业公司和商业场景。

目前这些主流前端框架，在36氪产品中均有深入的使用，目前我们正在招聘高级前端工程师，欢迎各路前端技术大牛前来切磋~