## 全局API | API名稱 | 說明 | | :----: | :----: | | element(element) | 獲取指定選擇器的元素 | | copy(obj[, dst]) | 創建obj對象或數組的深拷貝。如果有dst參數，則它完全由obj的深拷貝覆蓋 | | equals(o1, o2) | 比較兩個元素是否嚴格(===比較)相等 | | extend(dst, obj) | 從obj對象復制所有屬性到dst對象 | | forEach(obj, iterator[, context]) | 遍歷obj集合中的每個對象 | | fromJson(json) | 從一個JSON字符串返回一個JavaScript對象 | | toJson(obj, pretty) | 返回JavaScript對象的JSON字符串形式 | | isArray(value) | 判斷傳入的value是否為數組，如果是返回 true。 | | isDate(value) | 判斷傳入的value是否為Date對象，如果是返回true | | isDefined(value) | 如果傳入的value是一個已定義的對象，則返回true | | isElement(value) | 判斷傳入的value是否為一個DOM元素對象或JQuery元素對象。如果是返回true | | isFunction(value) | 判斷傳入的value是否為JavaScript函數，如果是返回true | | isNumber(value) | 判斷傳入的value是否為數值，如果是返回true | | isObject(value) | 判斷傳入的value是否是JavaScript對象，如果是返回true | | isString(value) | 判斷傳入的value是否為String對象，如果是返回 true。 | | isUndefined(value) | 判斷傳入的value是否定義，如果沒有定義返回true | | lowercase(value) | 轉換字符串為小寫 | | uppercase(vlaue) | 轉換字符串為大寫 | | bind(self, fn, args) | 返回一個新的函數，綁定這個函數的this指向self | | noop() | 空函數 | | module() | 定義一個模塊 | 1.4+版本新增： | API名稱 | 說明 | | :----: | :----: | | merge(dst, obj) | merge()方法類似extend()，從obj對象復制所有屬性到dst對象，不過它是深拷貝（對原對象的屬性進行遞歸，執行一次深拷貝） | | bootstrap() | 手動初始化angular | | version | 返回AngularJS使用的版本屬性 | **（1）element()** 獲取指定選擇器的元素。 示例（19-1.html）： ``` <div ng-controller="ParentController"> <span>item1</span> <span>item2</span> </div> <script> var myApp = angular.module('myApp', []); myApp.controller('ParentController', ['$scope', function($scope) { console.log(angular.element(document.querySelectorAll('span'))); }]); </script> // [span, span] ``` **（2）copy()** 創建obj對象或數組的深拷貝。如果有dst參數，則它完全由obj的深拷貝覆蓋。 語法： ``` copy(obj[, dst]) ``` 示例（19-2.html）： ``` var person = { name: 'angular', age: '12' }; var newObj = {}; var human = angular.copy(person, newObj); console.log(human); // Object {name: "angular", age: "12"} console.log(newObj); // Object {name: "angular", age: "12"} ``` **（3）equals()** 比較兩個元素是否嚴格(===比較)相等。 示例（19-3.html）： ``` console.log(angular.equals(1, 1)); // true console.log(angular.equals(1, '1')); // false ``` **（4）extend()** 從obj對象復制所有屬性到dst對象，返回拓展的對象： ``` angular.extend(dst, obj, obj2, ....);`` ``` 可傳入多個參數，第一個是要擴展的對象，后面的對象是要拷貝的對象（淺拷貝，即如果后面的obj和dst包含同名屬性且屬性值是對象時，會直接完全覆蓋）。 示例（19-4.html）： ``` var dst = {}; var obj = { name: 'js', detail: { a: 1 } }; var obj2 = { name: 'css', detail: { c: 2, b: 3 } }; console.log(angular.extend(dst, obj, obj2)); ``` 打印信息：  從上面的打印信息中，可以看到extend()方法是直接覆蓋同名屬性的。 **（5）forEach()** 遍歷obj集合中的每個對象。 示例（19-5.html）： ``` var person = { name: 'angular', age: '12' }; angular.forEach(person, function(value, key) { console.log(key + ':' + value) }); // name:angular // age:12 var arr = ['a', 'b']; angular.forEach(arr, function(value, index) { console.log(index + ':' + value); console.log(this.age); }, person); // 0:a // 12 // 1:b // 12 ``` **（6）fromJson()** 從一個JSON字符串返回一個JavaScript對象。 示例（19-6.html）： ``` console.log(angular.fromJson('{"name":"angular","version":"1.6.1"}')); // Object {name: "angular", version: "1.6.1"} ``` **（7）toJson()** 返回JavaScript對象的JSON字符串形式。 注：第二個參數可選，可為布爾型或數字，控制字符串輸出格式 示例（19-7.html） ``` console.log(angular.toJson({name:"angular"})); // {"name":"angular"} console.log(angular.toJson({name:"angular"}, true)); //{ // "name": "angular" //} console.log(angular.toJson({name:"angular"}, 4)); //{ // "name": "angular" //} ``` **（8）isArray()** 判斷傳入的value是否為數組，如果是返回 true。 示例： ``` angular.isArray(3); // false angular.isArray([]); // true ``` **（9）isDate()** 判斷傳入的value是否為Date對象，如果是返回true ``` angular.isDate('2017-02-16'); // false angular.isDate(new Date()); // true ``` **（10）isDefined()** 如果傳入的value是一個已定義的對象，則返回true。 示例： ``` angular.isUndefined(undefined) // true angular.isUndefined([]); // false ``` **（11）isElement()** 判斷傳入的value是否為一個DOM元素對象或JQuery元素對象。如果是返回true **（12）isFunction()** 判斷傳入的value是否為JavaScript函數，如果是返回true。 示例： ``` angular.isFunction(function() {}); // true angular.isFunction([]); // false ``` **（13）isNumber()** 判斷傳入的value是否為數值，如果是返回true。 示例： ``` angular.isNumber(1); // true angular.isNumber('a'); // false angular.isNumber(new Number(1)); // false angular.isNumber(Number(4)); // true ``` **（14）isObject()** 判斷傳入的value是否是JavaScript對象，如果是返回true 示例： ``` angular.isObject([]); // true angular.isObject(null); // false ``` **（15）isString()** 判斷傳入的value是否為String對象，如果是返回 true。 示例： ``` angular.isString(1); // false angular.isString('a'); // true angular.isString(new String('a')); // false angular.isString(String('a')); // true ``` **（16）isUndefined()** 判斷傳入的value是否定義，如果沒有定義返回true。 示例： ``` angular.isUndefined(undefined) // true angular.isUndefined(1); // false ``` **（17）lowercase()** 轉換字符串為小寫. 示例： ``` angular.lowercase('AbC'); // abc ``` **（18）uppercase()** 轉換字符串為大寫。 示例： ``` angular.uppercase('aBc'); // ABC ``` **（19）bind()** 類似js的bind，返回一個新的函數，綁定這個函數的this指向self。 示例（19-8.html）： ``` var obj = { age: 12, test: function(name) { console.log(name + ':' + this.age); } }; var self = { age: 10 }; var fn = angular.bind(self, obj.test, 'angular'); fn(); // angular:10 ``` 注意：bind會根據你的參數類型來決定調用call或apply，所以args可以是一個個數據，也可以是一個數組： ``` var fn = angular.bind(self, obj.test, ['angular']); fn(); // angular:10 ``` 注意：bind()最后返回來的是一個函數（類似JS的bind()）。 **（20）noop()** noop()返回一個空函數。 當某些時候你需要傳入函數參數，而且希望它什么也不做的時候，你可以使用該函數，也無需再新建一個空的函數。 示例： ``` var fn = angular.noop(); ``` **（21）module()** module()方法用來定義一個模塊。 ``` var myApp = angular.module('myApp', []); ``` **1.4+版本新增** **（22）merge()** merge()方法類似extend()，不過它是深拷貝： ``` angular.merge(dst, obj, obj2...); ``` 實例（19-9.html）： ``` var dst = {}; var obj = { name: 'js', detail: { a: 1 } }; var obj2 = { name: 'css', detail: { c: 2, b: 3 } }; console.log(angular.merge(dst, obj, obj2)); ``` 打印信息：  從打印信息中可以看出，merge()方法會對要拷貝的對象中的同名屬性進行一一拷貝，而不是像extend()一樣直接覆蓋。 **（23）bootstrap()** angular.bootstrap()方法用于手動初始化angular。 注：這個函數會自動檢測創建的module有沒有被加載多次，如果有則會在瀏覽器的控制臺打出警告日志，并且不會再次加載。這樣可以避免在程序運行過程中許多奇怪的問題發生。 語法： ``` angular.bootstrap(element, [modules], [config]); ``` 參數說明： - element DOM元素，作為angular的根元素 - modules：modules的一個數組，這里的module可以是用戶事先定義好的module或者是注入已有的function。 - config：擁有配置的對象。支持的配置如下: - strictDi - 禁用angular函數的注解, 一般擁有debug. 默認值是false. 此方法返回最新創建的injector。 一般我們是這樣啟動angular的： ``` <html ng-app> ``` 但如果你省略了`ng-app`指令，那你就需要手動啟動angular了。 實例（19-10.html）： ``` <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script src="../resources/angular/angular.min.js"></script> </head> <body> <div ng-controller="TestController"> {{ name }} </div> <script> var myApp = angular.module('myApp', []); myApp.controller('TestController', ['$scope', function($scope) { $scope.name = 'angular'; }]); angular.bootstrap(document, ['myApp']); </script> </body> </html> ``` 在這個例子中，我們并沒有添加`ng-app`指令來啟動angular，而是使用`angular.bootstrap()`方法來啟動（你可以試試注釋掉最后一行看看效果）。 **（24）version** 返回AngularJS使用的版本屬性： ``` angular.version ``` - full：字符串型 - major：數字型 - minor：數字型 - dot：數字型 - codeName：字符串型 實例（19-11.html）： ``` console.log(angular.version); ``` 打印信息：