AngularJS学习

1、AngularJS四大特性：MVC 、模块化、双向数据绑定、指令系统。
（1）MVC：一个古老的框架，MVC开始是存在于桌面程序中的，M是指业务模型，V是指用户界面，C则是控制器，使用MVC的目的是将M和V的实现代码分离，从而使同一个程序可以使用不同的表现形式。比如一批统计数据可以分别用柱状图、饼图来表示。C存在的目的则是确保M和V的同步，一旦M改变，V应该同步更新。

Model（模型）是应用程序中用于处理应用程序数据逻辑的部分。通常模型对象负责在数据库中存取数据。
View（视图）是应用程序中处理数据显示的部分。通常视图是依据模型数据创建的。
Controller（控制器）是应用程序中处理用户交互的部分。通常控制器负责从视图读取数据，控制用户输入，并向模型发送数据。
（2）模块化：在做angularjs时首先要考虑到的就是模块化（module），因为其他的东西都是挂在module下面的。只有将模块创建出来后才能去调用config、filter、controller之类的。所以首先要创建模块，然后在模块下创建控制器。
（3）指令系统：可以自定义一堆指令。ng-app就是一个指令，它类似于main方法，当遇到它时，就是说明开始使用angularjs。angularjs就是从ng-app启动的，所以单页也只能有一个。
（4）双向数据绑定：首先要说一下
单向数据绑定*它是将已经做好的模板和model从后台读取的数据相互绑定，生成HTML标签并将其插入到文档流里面生成视图，这就是经典的单向数据绑定。缺点是因为生成的HTML标签一旦生成就不能改变，一旦数据改变就要从新再次读取数据并进行绑定，将整体替换。*backbonejs不实现双向数据绑定的解释：大概的意思就是双向数据绑定在实际的运用中很少，没必要。

双向数据绑定视图与数据是对应的，当视图里面的数据发生变化时（例如表单数据发生变化，当用户在前端页面完成输入后，不用任何操作，我们就已经拿到了用户的数据存放到数据模型中了。），数据模型里面的数据也要发生变化。当数据模型里面的数据发生变化时，视图里面的数据也会自动去更新。这里就需要借助一个事件机制。实现双向数据绑定的前端框架主要有AngularJS，VueJS等。

2、为什么需要MVC？
前端代码规模越来越大，切分职责是大势所趋
为了复用：很多逻辑是一模一样
为了后期维护方便：修改一块功能不影响其它功能

MVC只是手段，终极目标是模块化和复用

3、前端实现MVC的困难
操作dom的代码必须等待整个页面全部加载完成
多个js文件之间如果出现互相依赖，程序员必须自己解决
js的原型继承也给前端编程带来了很多困难

因为：浏览器加载脚本是以字符串形式加载的，然后通过内部的JIT进行编辑
4、MVC实现方式：
一个控制器对应一个视图，当多个控制器有通用的东西，我们会把它抽出来，作为一个服务service来调用而不是让控制器继承通用的控制器(易错点)
注意：
不要用视图去复用Controller,一个控制器一般只负责一小块视图,同时控制器里面也有一些业务逻辑，业务逻辑的可复用性不强；
不要在Controller中操作DOM，这不是控制器的职责，DOM操作进行封装放在指令里面（操作DOM的效率很低，因为HTML标签的改变会造成浏览器去重写和重绘）；
不要在Controller里面做数据格式化，ng有很好的表单控件；
不要在Controller里面做数据过滤，ng有$filter服务；
一般来说，Controller是不会相互调用的，控制器之间的交互会通过事件。 控制器之间进行互相交互的方法：通过scope或者是数据模型上的事件去进行交互，controller在内部去进行监控事件，来实现一些操作。

5、如何复用model：
ng-modle运行机制：页面加载完成后angular启动，当找到ng_app之后angular就自动认为ng_app内的内容都是由它负责，然后去找这些程序里面所有的指令，并进行编译操作。找到ng-modle，生成ng-modle里面定义的数据模型，这个数据模型是挂在所谓的**$rootScope根作用域**上面的，所以之后在ng-app下面的所有子层标签任意一个层级上面都可以获取数据模型的值。angular里面的数据模型一般不需要去手动创建的（即不需要去明确的new一个），angular的数据模型一般是绑定在$scope对象的上面。


6、如何复用view（利用指令去实现视图的复用）

7、AngularJS的MVC是借助$scope（作用域）实现的，遵循js属性查找机制，会向上查找。
AngularJS也有事件机制，向上传播与向下传播。

可以使用firebug上面的插件进行辅助调试。