本人是腹黑 優(yōu)雅的程序員一小枚~~~~~~
angular之中，$state $watch $scope $rootScope 分別是什么？
1.背景介紹
在平時(shí)的編碼中，我們總會(huì)想著有什么方法能夠簡(jiǎn)化我們的工作流程，讓我們只專心于業(yè)務(wù)邏輯和數(shù)據(jù)的處理，而angularjs 就為我們程序員實(shí)現(xiàn)了這一點(diǎn)。$scope $rootScope $watch 和 $state就是里面的幾個(gè)方法，今天著重跟大家討論一下這 幾個(gè)方法
2.知識(shí)剖析
（1）$scope
$scope在angularjs中，你可以把它理解成作用域，每個(gè)不同的controller，都具有它不同的作用域，所以 controller不同，他們的scope是不同的，
當(dāng)你在 AngularJS 創(chuàng)建控制器時(shí)，你可以將 $scope 對(duì)象當(dāng)作一個(gè)參數(shù)傳遞:
{{carname}}
當(dāng)在控制器中添加 $scope 對(duì)象時(shí)，視圖 (HTML) 可以獲取了這些屬性。 視圖中，你不需要添加 $scope 前綴, 只需要添加屬性名即可，如： {{carname}}。 如果我們想象js那樣，做一個(gè)全局變量該怎么辦呢？這就要說 到rootScope了。
（2）$rootScope
$rootScope是由angularJS加載模塊的時(shí)候自動(dòng)創(chuàng)建的，每個(gè)模塊只會(huì)有1個(gè)rootScope;
$rootScope就相當(dāng)于一個(gè)全局作用域，所以我們保存在其中的東西是全局性的，在任一controller之中都能夠使用
scope是html和單個(gè)controller之間的橋梁，數(shù)據(jù)綁定就靠他了。rootscope是各個(gè)controller中scope的橋梁。 用rootscope定義的值，可以在各個(gè)controller中使用。
（3）$watch:
相信使用過angularjs的同學(xué)都知道，ng中有個(gè)比較重要的特點(diǎn)，叫做雙向綁定，那么這個(gè)雙向綁定是如何實(shí)現(xiàn)的呢？ 當(dāng)我們?cè)趧?chuàng)建出scope下的一個(gè)新屬性的時(shí)候，ng就會(huì)主動(dòng)為我們新屬性加上$watch這個(gè)方法，這個(gè)方法會(huì)監(jiān)聽我們 的數(shù)據(jù)變化，當(dāng)數(shù)據(jù)變化之后，就立即把view和scope上數(shù)據(jù)同步。
雖然angular會(huì)為每一個(gè)ng-model添加一個(gè)$watch事件，但我們還可以定義自己的$watch，所以需要了解一下$watch的用法；
$watch(watchExpression, listener, objectEquality);
watchExpression,需要監(jiān)控的表達(dá)式
listener,處理函數(shù)，函數(shù)參數(shù)如下 function(newValue,oldValue, scope)
objectEquality,是否深度監(jiān)聽，如果設(shè)置為true,它告訴Angular檢查所監(jiān)控的對(duì)象中每一個(gè)屬性的變化. 如果你希望監(jiān)控?cái)?shù)組的個(gè)別元素或者對(duì)象的屬性而不是一個(gè)普通的值, 那么你應(yīng)該使用它
（4）$state
在ajax技術(shù)發(fā)展普及之后，因?yàn)槠洳粫?huì)留下歷史記錄方便瀏覽器訪問和對(duì)于seo不友好的特點(diǎn)，一個(gè)新技術(shù)應(yīng)運(yùn)而生： 路由，$state就是路由中的一項(xiàng)服務(wù)。
路由的具體用法
此處可點(diǎn)→→→ui-rooter的使用方法
（5）$stateParams
$stateParams是一個(gè)對(duì)象，包含 url 中每個(gè)參數(shù)的鍵/值。$stateParams可以為控制器或者服務(wù)提供 url 的各個(gè)部分。 注意：$stateParams必須與一個(gè)控制器相關(guān)，并且$stateParams中的“鍵/值”也必須事先在那個(gè)控制器的url屬性中有定義。
3.常見問題
watch的深度監(jiān)聽是什么意思呢？有什么優(yōu)缺點(diǎn)呢？
4.解決方案
$watch在對(duì)待基本類型和引用類型會(huì)有不同的處理方式，這就要首先說一說$watch函數(shù)的第三個(gè)參數(shù)。它在默認(rèn)情況下是false。在默認(rèn)情況下，即不顯式指明第三個(gè)參數(shù)或者將其指明為false時(shí)，我們進(jìn)行的監(jiān)視叫做“引用監(jiān)視”。引用監(jiān)視的原詞的“reference watch”，它的意思是只要監(jiān)視的對(duì)象引用沒有發(fā)生變化，就不算它發(fā)生了變化。具體來說，在上面的例子中，只要是items的引用沒有發(fā)生變化，就算items中的一些屬性發(fā)生了變化，$watch也會(huì)當(dāng)做沒有看見。
如果我們將$watch的第三個(gè)變量設(shè)置為true，那么此時(shí)我們進(jìn)行的監(jiān)視叫做“全等監(jiān)視”，原詞是“equality watch”。此時(shí)，只要$watch的對(duì)象有一點(diǎn)風(fēng)吹草動(dòng)，它馬上就跳出來
既然全等監(jiān)視這么好，那么我們?yōu)槭裁床恢苯佑萌缺O(jiān)視呢？當(dāng)然，任何事情都有好的壞的兩個(gè)方面，全等監(jiān)視固然是好，但是它在運(yùn)行時(shí)需要先遍歷整個(gè)監(jiān)視對(duì)象，然后在每次$digest之前使用angular.copy()將整個(gè)對(duì)象深拷貝一遍然后在運(yùn)行之后用angular.equal()將前后的對(duì)象進(jìn)行對(duì)比，但是到了實(shí)際生產(chǎn)時(shí)，我們要面對(duì)的數(shù)據(jù)千千萬萬，可能因?yàn)槿缺O(jiān)視這一個(gè)設(shè)置就會(huì)消耗大量的資源，讓應(yīng)用停滯不前
5.編碼實(shí)戰(zhàn)
6.擴(kuò)展思考
怎么取消$watch，為什么取消？
$watch的性能消耗較大，所以對(duì)于已經(jīng)不需要監(jiān)視的watch，記得定時(shí)取消掉。
7.參考文獻(xiàn)
參考一：Angular.js中使用$watch監(jiān)聽模型變化
參考二：關(guān)于$watch應(yīng)用的一些小技巧
8.更多討論
感謝大家觀看奧。
