angularJS的工具方法_angularjs 怎么增加工具类方法-优快云博客

本文详细介绍了Angular JS中常用的API功能，包括this指向修改、对象拷贝、属性扩展、类型判断、版本查询、对象比较等功能，并展示了如何利用这些API进行高效开发。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1. angular.bind --- 类似于JQuery中的 $.proxy():修改this指向

用法：

    function show(n1,n2){
	     alert(n1);
		    alert(n2);
		    alert(this);
	   }   
	  show(); 
	  angular.bind(document,show,3,4)();
	  //第一个参数：第二个参数的this指向;第二个参数是被修改this指向的的函数名;
	  //后面的参数是该函数的形式参数。
	  angular.bind(document,show,3)(4); //等价
	  angular.bind(document,show)(3,4); //等价

2. angular.copy --- 拷贝对象
用法：

    var a = {
	  name:"Luck"
          };
	  var b = {
	    age:"20"
	  };
	  //var c = angular.copy(a);
	  //console.log(c)
	  var c = angular.copy(a,b);
	  console.log(a) //不变
	  console.log(b) //a的copy,同a
	  console.log(c) //也是a的copy,同a

3. angular.extend
用法：

      var a = {
	   name:"Luck"
	  };
	  var b = {
	    age:"20"
	  };
	  var c = angular.extend(a,b);
	  console.log(a)//继承了b, a{ name="Luck",age="20"}
	  console.log(b)//不变, b{ age="20"}
	  console.log(c)//同a

    angular.isArray  -- 判断是不是数组,返回true or false
	angular.isDate
	angular.isDefined
	angular.isUndefined
	angular.isFunction
	angular.isNumber
	angular.isObject
	angular.isString
	angular.isElement -- 判断是不是DOM元素,也可以判断JQuery获取到的元素

1. angular.version -- 返回使用的angular库的版本对象
2. angular.equals -- 判断两个参数是否相等,只要是相同的就返回真,与原生JS不同
--原生JS： []==[]:false; NaN==NaN:false
3. angular.forEach -- 遍历操作：接收3个参数：
--1. 数组或对象,2. 回调函数function(value,key),3. 操作返回的新的结果(操作后的数组或对象)
4. angular.fromJson/toJson -- 对字符串形式的JSON进行解析-JSON.parse()/转换-JSON.stringify()
--参数2可选，为true时，会对得到的结果进行换行操作，方便阅读
5. angular.identity/noop -- 辅助函数,默认值的操作

//实现原理：
	function identity(arg){return arg;}
        function noop(){}
	//防止不传参数时，函数会出问题

6. angular.lowercase/uppercase -- 小/大写字符串转换
7. angular.element -- 获取DOM元素，如angular.element(oDiv).css("color","#000");

                //angular 内部融入了JQuery库的简版功能,实现了JQuery中的一些常用DOM操作的部分方法
		//在网页中引入JQuery,
		//然后：1. angular.element === $;
		//      2. $("#div").css("color","#000");可以直接使用
		//    等价于 $("#div").css("color","#000");

8. angular.bootstrap //在JS中动态初始化angular,可以多次初始化

//用法：
	    document.onclick=function(){
	        angular.bootstrap(document,["myApp"]); //等价于<html ng-app="myApp">
	    };
	    //好处,动态创建功能
		
	    //初始化说明：
	    var m1 = angular.module("myApp1",[]);
	    m1.controller("A",["$scope",function($s){
	       $s.name="hello";
	    }]);
	    var m2 = angular.module("myApp2",[]); 
	    m2.controller("B",["$scope",function($s){
	       $s.name="hi";
	    }]);

     <!--静态初始化缺陷：-->
	<div  ng-app="myApp1" ng-controller="A">
            <p>{{name}}</p>
        </div>
        <div ng-app="myApp2" ng-controller="B">
            <p>{{name}}</p>
        </div>
     <!-- 这种情形，只有第一个div中的name会被解析，第二个不会被解析-->

      //----解决办法---借助angular.bootstrap()多次动态初始化
		document.onclick=function(){
	        var div = document.getElementsByTagName("div");
		    angular.bootstrap(div[0],["myApp1"]); 
			angular.bootstrap(div[1],["myApp2"]);
		};

9. angular.injector---angular内部使用