一、ng-show/ng-hide 與ng-if的區別？
我們都知道ng-show/ng-hide實際上是通過display來進行隱藏和顯示的。而ng-if實際上控制dom節點的增刪除來實現的。因此如果我們是根據不同的條件來進行dom節點的加載的話，那麼ng-if的性能好過ng-show .
二、解釋下什麼是$rootScrope以及和$scope的區別？
通俗的說$rootScrope頁面所有$scope的父親。
我們來看下如何產生$rootScope和$scope吧。
step1:Angular解析ng-app然後在內存中創建$rootScope 。
step2:angular回繼續解析，找到{{}}表達式，並解析成變量。
step3:接著會解析帶有ng-controller的div然後指向到某個controller函數。這個時候在這個controller函數變成一個$scope對象實例。
三、表達式{{yourModel}}是如何工作的？
它依賴於$interpolation服務，在初始化頁面html後，它會找到這些表達式，並且進行標記，於是每遇見一個{{}} ，則會設置一個$watch 。而$interpolation會返回一個帶有上下文參數的函數，最後該函數執行，則算是表達式$parse到那個作用域上。
四、Angular中的digest週期是什麼？
每個digest週期中，angular總會對比scope上model的值，一般digest週期都是自動觸發的，我們也可以使用$apply進行手動觸發。
五、如何取消$timeout, 以及停止一個$watch()?
停止$timeout我們可以用cancel ：
var customTimeout = $timeout(function () { // your code}, 1000);$timeout.cancel(customTimeout);停掉一個$watch：
// .$watch() 會返回一個停止註冊的函數function that we store to a variable var deregisterWatchFn = $rootScope.$watch('someGloballyAvailableProperty', function (newVal) { if (newVal) { // we invoke that deregistration function, to disable the watch deregisterWatchFn(); ... }});六、Angular Directive中restrict 中分別可以怎樣設置？ scope中@,=,&有什麼區別？
restrict中可以分別設置:
A匹配屬性
E匹配標籤
C匹配class
M 匹配註釋
當然你可以設置多個值比如AEC ,進行多個匹配。
在scope中，@,=,&在進行值綁定時分別表示
@獲取一個設置的字符串，它可以自己設置的也可以使用{{yourModel}}進行綁定的;
= 雙向綁定，綁定scope上的一些屬性；
& 用於執行父級scope上的一些表達式，常見我們設置一些需要執行的函數
angular.module('docsIsolationExample', []) .controller('Controller', ['$scope', function($scope) { $scope.alertName = function() { alert('directive scope &'); }}]).directive('myCustomer', function() { return { restrict: 'E', scope: { clickHandle: '&' }, template: '<button ng-click="testClick()">Click Me</button>', controller: function($scope) { $scope.testClick = function() { $scope.clickHandle(); } } };});<div ng-app="docsIsolationExample"> <div ng-controller="Controller"> <my-customer click-handle="alertName()"></my-customer></div> </div>
< 進行單向綁定。
七、列出至少三種實現不同模塊之間通信方式？
1、Service
2、events,指定綁定的事件
3、使用$rootScope
4、controller之間直接使用$parent, $$childHead等
5、directive 指定屬性進行數據綁定
八、有哪些措施可以改善Angular 性能
官方提倡的，關閉debug , $compileProvider
myApp.config(function ($compileProvider) { $compileProvider.debugInfoEnabled(false);});使用一次綁定表達式即{{::yourModel}}
減少watcher數量
在無限滾動加載中避免使用ng-repeat
使用性能測試的小工具去挖掘你的angular性能問題，我們可以使用簡單的console.time()也可以藉助開發者工具以及Batarang
console.time("TimerName"); //your codeconsole.timeEnd("TimerName");九、你認為在Angular中使用jQuery好麼？
這是一個開放性的問題，儘管網上會有很多這樣的爭論，但是普遍還是認為這並不是一個特別好的嘗試。其實當我們學習Angular的時候，我們應該做到從0去接受angular的思想，數據綁定，使用angular自帶的一些api，合理的路由組織和，寫相關指令和服務等等。 angular自帶了很多api可以完全替代掉jquery中常用的api，我們可以使用angular.element，$http,$timeout,ng-init等。
我們不妨再換個角度，如果業務需求，而對於一個新人（比較熟悉jQuery）的話，或許你引入jQuery可以讓它在解決問題，比如使用插件上有更多的選擇，當然這是通過影響代碼組織來提高工作效率，隨著對於angular理解的深入，在重構時會逐漸摒棄掉當初引入jquery時的一些代碼。 (?Po主就是這樣的人，希望不要被嘲笑，業務卻是趕著走)
所以我覺得兩種框架說完全不能一起用肯定是錯的，但是我們還是應該盡力去遵循angular的設計。
十、如何進行angular的單元測試
我們可以使用karam＋jasmine 進行單元測試,我們通過ngMock引入angular app然後自行添加我們的測試用例。 一段簡單的測試代碼：
describe('calculator', function () { beforeEach(module('calculatorApp')); var $controller; beforeEach(inject(function(_$controller_){ $controller = _$controller_; })); describe('sum', function () { it('1 + 1 should equal 2', function () { var $scope = {}; var controller = $controller('CalculatorController', { $scope: $scope }); $scope.x = 1; $scope.y = 2; $scope.sum(); expect($scope.z).toBe(3); }); });});十一、總結
以上就是這篇文章的全部內容了，希望對大家的學習和工作能有所幫助。如果有疑問可以留言討論。