【JS-TASK7】ANGULAR之中，$STATE $WATCH $SCOPE $ROOTSCOPE 分别是什么？

1.背景介绍

在平时的编码中，我们总会想着有什么方法能够简化我们的工作流程，让我们只专心于业务逻辑和数据的处理，而angularjs就为我们程序员实现了这一点。$scope $rootScope $watch 和 $state就是里面的几个方法，今天着重跟大家讨论一下这几个方法

2.知识剖析

$scope
$scope在angularjs中，你可以把它理解成作用域，每个不同的controller，都具有它不同的作用域，所以

controller不同，他们的scope是不同的，那么，如果我们想象js那样，做一个全局变量该怎么办呢？这就要说

到rootScope了。

$rootScope
$rootScope是由angularJS加载模块的时候自动创建的，每个模块只会有1个rootScope;

$rootScope就相当于一个全局作用域，所以我们保存在其中的东西是全局性的，在任一controller之中都能够使用

scope是html和单个controller之间的桥梁，数据绑定就靠他了。rootscope是各个controller中scope的桥梁。

用rootscope定义的值，可以在各个controller中使用。

$watch
相信使用过angularjs的同学都知道，ng中有个比较重要的特点，叫做双向绑定，那么这个双向绑定是如何实现的呢？

当我们在创建出scope下的一个新属性的时候，ng就会主动为我们新属性加上$watch这个方法，这个方法会监听我们

的数据变化，当数据变化之后，就立即把view和scope上数据同步。

虽然angular会为每一个ng-model添加一个$watch事件，但我们还可以定义自己的$watch，所以需要了解一下$watch的用法；

$watch(watchExpression, listener, objectEquality);

watchExpression:监听的对象，它可以是一个angular表达式如’name’,或函数如function();注意如果是函数的话，需要加上（）不能只写函数名；

listener:当watchExpression变化时会被调用的函数或者表达式,它接收3个参数：newValue(新值), oldValue(旧值), scope(作用域的引用)

objectEquality,是否深度监听，如果设置为true,它告诉Angular检查所监控的对象中每一个属性的变化. 如果你希望监控数组的个别元素或者对象的属性而不是一个普通的值, 那么你应该使用它

$state
$state是路由中的一项服务,简单来说就是给路由一个对应的状态，让其根据不同的状态加载不同的页面；

路由的具体用法

$stateParams
$stateParams是一个对象，包含url中每个参数的键/值。$stateParams可以为控制器或者服务提供 url 的各个部分。

注意：$stateParams必须与一个控制器相关，并且$stateParams中的“键/值”也必须事先在那个控制器的url属性中有定义。

3.常见问题

如何通过$rootscope传参

4.解决方案

app.controller('AController', function ($scope, $rootScope) {
$rootScope.varX = "XXX";
});
app.controller('BController', function ($scope, $rootScope) {
console.log("$rootScope.varX:", $rootScope.varX);
});

5.编码实战

demo1

6.扩展思考

怎么取消$watch，为什么取消？

$watch的性能消耗较大，所以对于已经不需要监视的watch，记得定时取消掉。

7.参考文献

     <p>http://yuankeqiang.lofter.com/post/8de51_1454f93</p>
        <p>https://blog.csdn.net/u010451286/article/details/50635839</p>

8.更多讨论

1.$rootScope是否可以替代$scope？
可以，但是不建议这样用，相当于js中的全局变量，定义过多会导致全局污染；

2.数组深拷贝当中的slice()的用法：
slice()能够基于当前数组中的一个或则多个项创建一个新数组；

该方法可以接收1-2个参数，在只有一个参数的情况下，该方法返回引用数组的所有项，两个参数的情况下，该方法返回起始和结束位置之间的（但是不包括结束项）所有项；

3.$stateParams如果没有用url接收会怎样？如果没有在url里面接收，会导致再次提取$stateParams中的数据的时候，会找不到该数据；$stateParams对象中根本就没有该属性；