【Angular Js】
【软件工程】
1.软件设计“原则”：
- 避免重复原则（DRY – Don’t repeat yourself）
- KISS原则（Keep It Simple and Stupid ）：
逻辑代码越简单越少；
- 避免创建你不要的代码 YAGNI (You aren’t going to need it)
- 开闭原则(Open/Closed Principle)
别人可以基于你的代码进行拓展编写，但却不能修改你的代码
- 最小惊讶原则(Principle of least astonishment)
你编写的代码只需按照项目的要求来编写。其他华丽的功能就不必了，以免弄巧成拙。
- 单一责任原则(Single Responsibility Principle)
某个代码的功能，应该保证只有单一的明确的执行任务。
- 高聚合低耦合原则
一个组件内部的逻辑关系越紧密越好(高聚合)；组件与组件之间的关系越少越好(低耦合)；
- 迪米特法则又叫作最少知识原则(Law of Demeter)：百度百科解释为->就是说一个对象应当对其他对象有尽可能少的了解,不和陌生人说话。(低耦合)
2.软件【设计模式】：大话设计模式--java
23+1中设计模式；
+1：MVC模式；
3.MVC设计模式
马走日象走田 => 双炮枪/马后炮
|| ||
对象/原型/闭包 => 设计模式 => 设计框架
设计模式（Design pattern）是一套被反复使用、多数人知晓的、经过分类编目的、代码设计经验的总结。使用设计模式是为了可重用代码、让代码更容易被他人理解、保证代码可靠性。
23+1种设计模式
+1的那种设计模式：MVC模式
modal： 模态框['məʊd(ə)l]model： 模型['mɒdl]module： 模块['mɒdjuːl] |
根据逻辑关系，把前端项目的代码分为三个层次：
1).Model：模型，就是“业务数据”，前端项目中JS中的变量；
2).View：视图，“业务数据”在用户面前的展现；前端项目中就是HTML；
3).Controller：控制器，负责“业务数据”中的增删改查，前端项目中就是Function；
developer.mozilla.org
4.Angular Js概述：
是一个JS框架，彻底颠覆了传统的DOM操作，所有的关注点集中在业务数据上，而不是DOM树，适合以数据CRUD（增删改查）操作为主的SPA(Single Page Application)单页应用；QQ空间.饿了么.....
不需要数据的，如单页广告，飞机大战游戏等；
面试题：
AngularJs的四大特性：
1.MVC模型设计模式
2.双向数据绑定
3.依赖注入
4.模块化设计
5,第一个AngularJs（）页面；
i18n：语言包 internationalization 国际化 ；
引入angular.js；
6.ng表达式
语法：{{表达式}}
含义：ng会计算表达式，输出在当前位置；
测试：Angular表达式可以执行那些运算：
算数运算：+ - * / % 都可以 ； ++ --不可以！；
比较运算：< > 都可以；
逻辑运算：&& || ！都可以；
三目 ：可以；
字符串的属性和方法：可以；
在表达式使用对象直接量：可以 2.html;
使用数组：可以
使用new创建对象：不可以！不允许使用new和var关键字 *****
全局函数： 不可以！
|
JavaScript中对象的分类： (1)ECMAScript标准对象 Global String Date RegExp Array Object ... 可以在任一个js解释器中使用 (2)宿主对象： DOM: Node Element Attribute .... BOM: window document .... 只能在浏览器中的js解释器中使用，不能在独立的服务器端js解释器(如NodeJS)中使用 (3)用户自定义对象 |
7.ng模块提供的指令：Directive
1).ngApp：启动一个Angular应用--只有Angular应用中的表达式才会被执行；
用法：<ANY ng-app >...</ANY>
注意： Angular应用范围仅限于申明它的元素且默认情况下不允许声明多个ng-app，一般放在body或html元素上；
2).ngInit:声明模型变量--不是局部变量
用法：<ANY ng-init="变量名=值;变量名=值;" >...</ANY>
注意：ngInit申明的变量不能使用var关键字；声明的变量可以在Angular表达式中输出；***
3).ngBind:计算一个表达式的值，输出为当前元素的"innerHTML";
**** ngBind的指令及时完成后；元素的已有内容全会被替换；*****
可以利用这点做加载效果；********
用法：
<p ng-bind="age+5"></p>
<p class="ng-bind:age*2;"></p>
说明：ngBind指定作用与{{}}作用相似，只是在刷新的时候不会出现{}；
4).ngController:调用Controller创建函数，实例化一个控制器对象，指定其作用范围
用法：<ANY ng-controller="控制器名称" >...</ANY>
5).ngRepeat:用于在View中循环输出；
<ANY ng-repeat="变量名 in 集合对象">...</ANY> 变量名：值；
含义：对于集合对象的每个元素，一次赋值给指定的变量名，对每次赋值都输出一遍当前元素；
6).ngIf:用于在View中判断输出，为false就不输出；
用法：<ANY ng-if="布尔表达式">...</ANY>
8.AngularJs中声明模型数据的方式；
1).使用ngInit指令来声明Model数据
说明：此方式将Model数据声明在View中，严重违反了MVC分工；不推荐使用；
2).使用Controller对象创建Model数据--符合MVC分工；
新版本的AngularJs中创建Model的方法：
ngApp => Module => controller => Model;
-1.声明Angular应用程序：
HTML里：ngApp；
-2.创建一个自定义模块：
script里：angular.module('模块名',[依赖模块列表]);
-3.在应用程序里注册自定义模块：
让 data-ng-app="模块名"
-4.在模块中声明Controller函数：
-5.在View中指定Controller对象的作用范围；--调用控制器创建函数：
html里：<ANY ng-controller="控制器名称" >...</ANY>
-6.在Controller中声明Model数据； 3.html
$scope.string="hanmeimei";