js函数技巧

  1 <!DOCTYPE html>
  2 <html>
  3     <head>
  4         <meta charset="UTF-8">
  5         <title></title>
  6     </head>
  7     <body>
  8         <script>
  9         // 通过判断参数个数，模拟函数重载
 10            function add(){
 11              if(arguments.length ==1){
 12                 return arguments[0]+5;
 13              }else if(arguments.length == 2){
 14                 return arguments[0] + arguments[1];
 15              }
 16            }
 17         console.log(add(5))
 18         console.log(add(15,45));
 19 
 20         //Function对象 
 21         var doadd = new Function('arg1',"arg2","return (arg1+arg2)");
 22         console.log(doadd(3,5));
 23 
 24         //Function对象的属性：length和方法valueof(),toString();这两个方法返回函数的源代码，length返回，要求的参数个数；
 25 
 26         function add(num1,num2){
 27             return num1 + num2;
 28         }
 29         console.log(add.length);
 30         console.log(add.valueOf());
 31         console.log(add.toString());
 32 
 33         //函数是对象，函数可以有自己的属性和方法
 34         function fun(num){
 35             console.log('111');
 36         }
 37         fun.hi= function(){
 38             console.log("hi,haha");
 39         }
 40         fun();
 41         fun.hi();
 42 
 43         //工厂函数
 44           function createCar(color,size,logo){
 45             var obj = new Object;
 46             obj.color =color;
 47             obj.logo = logo;
 48             obj.size = size;
 49             return obj;
 50           }
 51           var car1 = createCar("red","4","benchi");
 52           console.log(car1);
 53 
 54           var car2 = createCar("blue","3","bwm");
 55           console.log(car2);
 56 
 57         //  构造函数
 58         function Car(size,color,logo){
 59             this.color = color;
 60             this.logo = logo;
 61             this.size = size;
 62         }
 63         var car3 = new Car("5","green","dazhong");
 64         console.log(car3);
 65 
 66         var car4 = new Car("6","black","jiefang");
 67         console.log(car4);
 68 
 69         //原型方式      
 70         function Car(){
 71             Car.prototype.color = "red";
 72             Car.prototype.size = "7";
 73             Car.prototype.logo = "dongfanghong";
 74 
 75         }
 76         var car5 = new Car();
 77         console.log(car5);
 78         var car6 = new Car();
 79         console.log(car6);
 80 
 81         //混合构造、原型方法
 82         function Cat(age,color){
 83             this.age = age;
 84             this.color = color;
 85         }
 86         Cat.prototype.eat = function(){
 87             console.log("吃五个老鼠！");
 88         }
 89         var cat1 = new Cat("3","white");
 90         console.log(cat1);
 91          var cat2 = new Cat("4","black");
 92         console.log(cat2);
 93 
 94         //动态原型方法
 95         function Cat(age,color){
 96             this.age = age;
 97             this.color = color;
 98             if(typeof Car._initialized == "undefined"){
 99                 Car.prototype.eat = function(){
100                     console.log("吃五个老鼠！")
101                 }
102                 Car._initialized == true;
103             }
104         }
105 
106         //对象连接字符串
107         function StringBuffer(){
108             this._strings_ = new Array();
109         }
110         StringBuffer.prototype.append = function(str){
111             this._strings_.push(str);
112         }
113         StringBuffer.prototype.toString = function(str){
114             return this._strings_.join("");
115         }
116 
117         var buffer = new StringBuffer();
118         buffer.append("hello");
119         buffer.append("world");
120         buffer.append("  nihao");
121         console.log(buffer.toString());
122 
123         //修改对象
124 
125         //通过已有的方法创建新方法
126         Number.prototype.toHexString = function(){
127             return this.toString(16);
128         }
129         var b = 15;
130         console.log(b.toHexString());
131 
132         //重命名已有方法
133         Array.prototype.enqueue = function(item){
134             this.push(item);
135         }
136         Array.prototype.dequeue = function(){
137             this.shift();
138         }
139         var arr = ["1","a"];
140         arr.enqueue("b");
141         console.log(arr);
142         arr.dequeue("1");
143         console.log(arr);
144 
145         //添加新方法
146         Array.prototype.indexOf = function(item){
147             for(var i=0;i<this.length;i++){
148                 if(this[i] == item){
149                   return i; 
150                 }               
151             }
152             return -1;
153         }
154        console.log(arr.indexOf("b"));
155 
156        //为本地对象添加新方法
157        //如果想给 ECMAScript 中每个本地对象添加新方法，必须在 Object 对象的 prototype 属性上定义它。
158        Object.prototype.showValue = function(){
159         console.log(this.valueOf());
160        }
161        var str = "hello";
162        str.showValue();
163 
164     //重定义已有的方法
165 //     Function.prototype.toString = function(){
166 //      return "function code hidden!";
167 //     }
168 //      function sayHi(){
169 //          console.log("hi");
170 //      }
171 //      console.log(sayHi.toString());
172 
173     //覆盖原始方法前，比较安全的做法是存储它的指针，以便以后的使用。有时你甚至可能在新方法中调用原始方法
174        Function.prototype.originToString = Function.prototype.toString;
175        Function.prototype.toString = function(){
176         if(this.originToString().length>20){
177             return "Function too long to display！"
178         }else{
179             return this.originToString();
180         }
181        }
182        function sayHi(){
183             console.log("hi");
184         }
185        console.log(sayHi.toString());
186 
187     //极晚绑定，先实例化对象，再定义方法，也能把方法给到之前创建的实例, 不建议这么用
188        var o = new Object();
189        Object.prototype.sayHi = function(){
190         console.log("hi");
191        }
192        o.sayHi();      
193 
194     /*所谓绑定（binding），即把对象的接口与对象实例结合在一起的方法。
195        早绑定（early binding）是指在实例化对象之前定义它的属性和方法，这样编译器或解释程序就能够提前转换机器代码。
196           在 Java 和 Visual Basic 这样的语言中，有了早绑定，就可以在开发环境中使用 IntelliSense（即给开发者提供对象中属性和方法列表的功能）。
197        ECMAScript 不是强类型语言，所以不支持早绑定。
198        另一方面，晚绑定（late binding）指的是编译器或解释程序在运行前，不知道对象的类型。
199        使用晚绑定，无需检查对象的类型，只需检查对象是否支持属性和方法即可。ECMAScript 中的所有变量都采用晚绑定方法。这样就允许执行大量的对象操作，而无任何惩罚。*/
200         </script>
201     </body>
202 </html>

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <script> // 通过判断参数个数，模拟函数重载 function add(){ if(arguments.length ==1){ return arguments[0]+5; }else if(arguments.length == 2){ return arguments[0] + arguments[1]; } } console.log(add(5)) console.log(add(15,45));
//Function对象   var doadd = new Function('arg1',"arg2","return (arg1+arg2)"); console.log(doadd(3,5));
//Function对象的属性：length和方法valueof(),toString();这两个方法返回函数的源代码，length返回，要求的参数个数；
function add(num1,num2){ return num1 + num2; } console.log(add.length); console.log(add.valueOf()); console.log(add.toString());
//函数是对象，函数可以有自己的属性和方法 function fun(num){ console.log('111'); } fun.hi= function(){ console.log("hi,haha"); } fun(); fun.hi();
//工厂函数 function createCar(color,size,logo){ var obj = new Object; obj.color =color; obj.logo = logo; obj.size = size; return obj; } var car1 = createCar("red","4","benchi"); console.log(car1);
var car2 = createCar("blue","3","bwm"); console.log(car2);
// 构造函数 function Car(size,color,logo){ this.color = color; this.logo = logo; this.size = size; } var car3 = new Car("5","green","dazhong"); console.log(car3);
var car4 = new Car("6","black","jiefang"); console.log(car4);
//原型方式    function Car(){ Car.prototype.color = "red"; Car.prototype.size = "7"; Car.prototype.logo = "dongfanghong";
} var car5 = new Car(); console.log(car5); var car6 = new Car(); console.log(car6);
//混合构造、原型方法 function Cat(age,color){ this.age = age; this.color = color; } Cat.prototype.eat = function(){ console.log("吃五个老鼠！"); } var cat1 = new Cat("3","white"); console.log(cat1); var cat2 = new Cat("4","black"); console.log(cat2);
//动态原型方法 function Cat(age,color){ this.age = age; this.color = color; if(typeof Car._initialized == "undefined"){ Car.prototype.eat = function(){ console.log("吃五个老鼠！") } Car._initialized == true; } }
//对象连接字符串 function StringBuffer(){ this._strings_ = new Array(); } StringBuffer.prototype.append = function(str){ this._strings_.push(str); } StringBuffer.prototype.toString = function(str){ return this._strings_.join(""); }
var buffer = new StringBuffer(); buffer.append("hello"); buffer.append("world"); buffer.append(" nihao"); console.log(buffer.toString());
//修改对象
//通过已有的方法创建新方法 Number.prototype.toHexString = function(){ return this.toString(16); } var b = 15; console.log(b.toHexString());
//重命名已有方法 Array.prototype.enqueue = function(item){ this.push(item); } Array.prototype.dequeue = function(){ this.shift(); } var arr = ["1","a"]; arr.enqueue("b"); console.log(arr); arr.dequeue("1"); console.log(arr);
//添加新方法 Array.prototype.indexOf = function(item){ for(var i=0;i<this.length;i++){ if(this[i] == item){ return i;   }     } return -1; } console.log(arr.indexOf("b"));
//为本地对象添加新方法 //如果想给 ECMAScript 中每个本地对象添加新方法，必须在 Object 对象的 prototype 属性上定义它。 Object.prototype.showValue = function(){ console.log(this.valueOf()); } var str = "hello"; str.showValue();
//重定义已有的方法// Function.prototype.toString = function(){// return "function code hidden!";// }// function sayHi(){// console.log("hi");// }// console.log(sayHi.toString());
//覆盖原始方法前，比较安全的做法是存储它的指针，以便以后的使用。有时你甚至可能在新方法中调用原始方法 Function.prototype.originToString = Function.prototype.toString; Function.prototype.toString = function(){ if(this.originToString().length>20){ return "Function too long to display！" }else{ return this.originToString(); } } function sayHi(){ console.log("hi"); } console.log(sayHi.toString());
//极晚绑定，先实例化对象，再定义方法，也能把方法给到之前创建的实例, 不建议这么用 var o = new Object(); Object.prototype.sayHi = function(){ console.log("hi"); } o.sayHi();
/*所谓绑定（binding），即把对象的接口与对象实例结合在一起的方法。早绑定（early binding）是指在实例化对象之前定义它的属性和方法，这样编译器或解释程序就能够提前转换机器代码。在 Java 和 Visual Basic 这样的语言中，有了早绑定，就可以在开发环境中使用 IntelliSense（即给开发者提供对象中属性和方法列表的功能）。 ECMAScript 不是强类型语言，所以不支持早绑定。另一方面，晚绑定（late binding）指的是编译器或解释程序在运行前，不知道对象的类型。使用晚绑定，无需检查对象的类型，只需检查对象是否支持属性和方法即可。ECMAScript 中的所有变量都采用晚绑定方法。这样就允许执行大量的对象操作，而无任何惩罚。*/ </script> </body></html>

猜你喜欢