angularJS学习手册（1）

欢迎来到augularJS的学习

1、什么是angularJS？

angular的英文意思是角，为何要叫angular我也不知道。

AngularJS是一个MV*（Model-View-Whatever，不论是MVC或者MVVM，统归MDV(model Drive View)）JavaScript框架，其是Google推出的SPA（single-page-application）应用框架，其为咱们的web应用开发增长很多魔法变换。将让你的开发很是爽。AngularJS有着诸多特性，最为核心的是：MVVM、模块化、自动化双向数据绑定、语义化标签、依赖注入等等。

没错他是个框架，那jquery是个什么呢？

jquery是个类库。angularJS 和Jquery都是用JS写的。

框架和类库的区别在哪儿？

举个例子：你须要建一个游泳池。游泳池的工程图就是一个框架，建造游泳池用到的挖掘机就是一个类库。

2、angularJS能作什么？

简单来讲就是方便你开发web应用（等于没说）。

angularJS主要是用于CRUD的web应用，而像如游戏，图形界面编辑器这些web应用就没有必要使用angularJS

3、使用angularJS须要具有哪些知识？

W3school里面的大部分知识都得具有。

最好有开发过web网站的经验，知道平时开发web应用的麻烦之处，才能体会用angularJS避免这些麻烦的快感~~。

固然，相似angularJS的框架有不少，但基本点理念都是相同的，对其余前端框架有了解的话，学起angularJS会很快速。（好比 node.js【这不是一个框架，而是一个能让JavaScrit运行在服务器上的平台，】，React【一个用于建立用户界面的 JavaScript 库】）

4、angularJS的理念（可不看）

 

Angular信奉的是，当组建视图(UI)同时又要写软件逻辑时，声明式的代码会比命令式的代码好得多，尽管命令式的代码很是适合用来表述业务逻辑。

 

将DOM操做和应用逻辑解耦是一种很是好的思路，它能大大改善代码的可调性；

 

将测试和开发同等看待是一种很是很是好的思路，测试的难度在很大程度上取决于代码的结构；

 

将客户端和服务器端解耦是一种特别好的作法，它能使两边并行开发，而且使两边代码都能实现重用；

 

若是框架可以在整个开发流程里都引导着开发者：从设计UI，到编写业务逻辑，再到测试，那对开发者将是极大的帮助；

 

“化繁为简，化简为零”老是好的。

 

AngularJS能将你从如下的噩梦中解脱出来：

 

使用回调：回调的使用会打乱你的代码的可读性，让你的代码变得支离破碎，很难看清原本的业务逻辑。移除一些常见的代码，例如回调，是件好事。大幅度地减小你由于JavaScript这门语言的设计而不得不写的代码，能让你把本身应用的逻辑看得更清楚。

 

手动编写操做DOM元素的代码：操做DOM是AJAX应用很基础的一部分，但它也老是很“笨重”而且容易出错。用声明的方式描述的UI界面可随着应用状态的改变而变化，能让你从编写低级的DOM操做代码中解脱出来。绝大部分用AngularJS写的应用里，开发者都不用再本身去写操做DOM的代码，不过若是你想的话仍是能够去写。

 

对UI界面读写数据：AJAX应用的很大一部是CRUD操做。一个经典的流程是把服务端的数据组建成内部对象，再把对象编成HTML表单，用户修改表单后再验证表单，若是有错再显示错误，而后将数据从新组建成内部对象，再返回给服务器。这个流程里有太多太多要重复写的代码，使得代码看起来老是在描述应用的所有执行流程，而不是具体的业务逻辑和业务细节。

 

开始前得写大量的基础性的代码：一般你须要写不少的基础性的代码才能实现一个“Hello World”的应用。用AngularJS的话，它会提供一些服务让你很容易地正式开始写你的应用，而这些服务都是以一种Guice-like dependency-injection式的依赖注入自动加入到你的应用中去的,这让你能很快的进入你应用的具体开发。特别的是，你还能全盘掌握自动化测试的初始化过程。

5、AngularJS的优缺点

优势：
1. 模板功能强大丰富，而且是声明式的，自带了丰富的Angular指令；
2. 是一个比较完善的前端MV*框架，包含模板，数据双向绑定，路由，模块化，服务，过滤器，依赖注入等全部功能；
3. 自定义Directive，比jQuery插件还灵活，可是须要深刻了解Directive的一些特性，简单的封装容易，复杂一点官方没有提供详细的介绍文档，咱们能够经过阅读源代码来找到某些咱们须要的东西，如：在directive使用 $parse；
4. ng模块化比较大胆的引入了Java的一些东西（依赖注入），可以很容易的写出可复用的代码，对于敏捷开发的团队来讲很是有帮助，咱们的项目从上线到目前，UI变化很大，在摸索中迭代产品，可是js的代码基本上不多改动。
5. 补充：Angular支持单元测试和e2e-testing。

缺点：
1. 验证功能错误信息显示比较薄弱，须要写不少模板标签，没有jQuery Validate方便，因此咱们本身封装了验证的错误信息提示，详细参考 why520crazy/w5c-validator-angular · GitHub ；
2. ngView只能有一个，不能嵌套多个视图，虽然有 angular-ui/ui-router · GitHub 解决，可是貌似ui-router 对于URL的控制不是很灵活，必须是嵌套式的（也许我没有深刻了解或者新版本有改进）；
3. 对于特别复杂的应用场景，貌似性能有点问题，特别是在Windows下使用chrome浏览器，不知道是内存泄漏了仍是什么其余问题，没有找到好的解决方案，奇怪的是在IE10下反而很快，对此还在观察中；
4. 此次从1.0.X升级到1.2.X，貌似有比较大的调整，没有完美兼容低版本，升级以后可能会致使一个兼容性的BUG，具体详细信息参考官方文档 AngularJS ，对应的中文版本：Angular 1.0到1.2 迁移指南
5. ng提倡在控制器里面不要有操做DOM的代码，对于一些jQuery 插件的使用，若是想不破坏代码的整洁性，须要写一些directive去封装插件，可是如今有不少插件的版本已经支持Angular了，如：jQuery File Upload Demo
6. Angular 太笨重了，没有让用户选择一个轻量级的版本，固然1.2.X后，Angular也在作一些更改，好比把route，animate等模块独立出去，让用户本身去选择。

固然使用的人多才会暴露更多的问题，一块儿为这些问题寻找解决方案是一个社区的良性趋势，选择Angular，的确使咱们的开发效率大大提升。

做者：徐海峰
连接：https://www.zhihu.com/question/22284218/answer/20893162
来源：知乎
著做权归做者全部。商业转载请联系做者得到受权，非商业转载请注明出处。