大漠穷秋

 

[郑重警告：此文略犀利，可能引起肾上腺素升高、内心不适等症状，请慎重浏览。]

 

Angular不能做什么？对比Angular/jQueryUI/Extjs

 

框架就好比兵器，你得明白你手里拿的是屠龙刀还是倚天剑，刀法主要是砍，剑法主要是刺。对于那些职业喷子和脑残粉，小僧送你们两个字：呵呵；同时祝你幸福，请点右上角。

 

首先要明白Angular不能做什么，或者Angular没有提供什么，然后再来看它能做什么，来看Angular与其它一些主流框架的对比。

 

 

 

对于上面的表格，有人可能要跟我抬杠，咱大jQuery不是有各种插件吗！不是有各种EasyUI、LigerUI等等一大堆UI吗！

 

我只想说，你特么到底有没有做过大型的开发？各种东西倒腾在一起的组装货能比得上品牌机？另外遇到jQuery版本不兼容就够你喝一壶了吧！说jQueryUI各种乱已经是对它客气了，实际上是一塌糊涂！

 

提醒某些小白区分好概念，小僧的喷点是jQueryUI，而不是jQuery，jQuery这把小巧玲珑的瑞士军刀小僧还是非常喜欢滴！另外，也有 一批基于jQuery的UI套件做得非常优秀，比如KendoUI，但是一分钱一分货，好东西基本上都是收费的。这么多年下来了，你应该早就习惯了这条行 规。再说一次，好！东！西！都！是！收！费！的！

 

又有人说，怎么没把bootstrap列在里面对比一下？请问油漆桶和Tank战车怎么比？你比给我看看。

 

关于前端UI体系的特别说明

 

对于前端UI系统，特别说明一下。一般来说，前端UI必须包含以下控件和工具（参照了我最熟悉的Extjs）：

 

• Form

  TextField

  NumberField

  PassWord

  ComboBox

  CheckBox

  Radio

  DatePicker/TimePicker（日期和时间控件一般没有人会自己去写，太复杂了！）

  表单验证：本地验证和远程验证

• DataGrid

  复杂表头、数据格式、行内各种格式、动态编辑、分页、动态列、滚动（等等）

  完善的数据表格也是一个非常复杂的控件，完全自己开发不容易！

• Tree

• Window

  模态/非模态

• Panel

• TabPanel

  tab懒加载（内存释放和浏览器兼容性比较繁琐，做完善不容易！）

• HTMLEditor

  应该没有哪个疯子想自己去做一个类似KindEditor那样在线编辑器吧！什么？你想做？药不能停！

• 小组件

  ToolTip

  Slider

  Pager

  ProgressBar

  Menu

  Label

  Image

  Alert

• 布局

  布局系统是比较复杂的，必须有深厚的CSS基础，否则搞出来的东西一定有兼容性问题！好吧，我知道有人肯定要说bootstrap了，既然都在说那么小僧就不说了，自己玩儿去！

• 其它工具

  Ajax

  模板

  数据格式化

  其它各种控件就不说了，比如幻灯片效果、面包屑，再比如“×款超棒的jQuery××”等等。

 

Angular没有提供完善的UI，没有提供CSS样式套件，也没有对移动平台进行直接支持。所以，如果你使用Angular，你一定需要其它东西来配合。例如，如果需要UI，你需要使用jQueryUI，或者自己封装UI组件；如果需要CSS样式，你可以选择bootstrap或者LESS；如果需要支持移动平台，还是需要你自己 去开发。

 

好了，看到这里有人开始嘀咕了，这特么岂不是什么都没有嘛！！！

 

莫急，再来看Angular有什么。

 

Angular能做什么？

 

1、自动化的数据双向绑定；2、MVC；3、依赖注入---DI系统；4、指令系统（可以自定义语义化标签）---Directive机制；5、模块化---Module机制；6、路由机制---Route机制；7、服务---Service机制；8、内嵌表达式---Expression机制；9、前端代码单元测试和集成测试的自动化（借助于Yeoman等工具）；10、模板；11、动态加载；

 

这么多机制里面，核心的核心是指令系统，实际上其它所有特性都是建立在指令系统之上的。本质上说，Angular写了一个JS版的编译器，一切都构 建在这款编译器之上。对于使用者来说，可以把解析器看成一个JS虚拟机，有兴趣的人可以自己阅读Angular的Parser（HTML解析器）源码。

 

HTML解析器机制是其它所有框架所不具备也不敢这样做的，它是Angular的灵魂。

 

结论

 

很显然，Angular并没有打算做一个高大全的所谓【框架】，它的核心价值在于，把一堆后台框架的概念带到了前端框架中，比如依 赖注入（来自Spring）；同时又从其它地方抄了一些概念，比如数据自动双向绑定（貌似来自Flex）、模板、MVC、动态加载（来自 RequireJS等），等等。当然，这些理念都挺好。基于这些理念和工具，你可以把前端应用组织得非常良好。

 

但是，有一点请特别注意（尤其那些负责技术选型的所谓“架构尸”，请瞪大你的钛合金狗眼看好下面的内容）：对于界面非常复杂的业务 型系统，必须要要有完备的UI支持（Form、DataGrid、Tree、Tab、Window等）。如果你的团队整体JS水平很烂，或者压根没打算自 己去做很多东西，请慎用AngularJS！尤其是那些只有两三条破枪，连美工都没有的小公司，您请靠边儿凉快，这儿没您什么事儿。

 

最后的最后

 

没有一款框架能做所有事情，因为从来就 没！有！银！弹！（提醒小白，这个词出自《人月神话》）

 

对于那种幻想用一种框架（包括付费购买的）就能解决所有问题的小屁孩，扔给他一根棒棒糖吧！

 

 

其它相关内容：

1、OReilly的《AngularJS》已由电子工业出版社出版

http://damoqiongqiu.iteye.com/blog/1965167

2、《AngularJS》5个实例详解Directive（指令）机制

http://damoqiongqiu.iteye.com/blog/1917971

3、AngularJS表单基础

http://damoqiongqiu.iteye.com/blog/1920191

4、AngularJS Form 进阶：远程校验和自定义输入项

http://damoqiongqiu.iteye.com/blog/1920993

5、AngularJS：在Windows上安装Yeoman

http://damoqiongqiu.iteye.com/blog/1885371

6、使用JsTestDriver实现JavaScript单元测试

http://damoqiongqiu.iteye.com/blog/1924415