JavaScript学习总结(十四)——JavaScript编写类的扩展方法详解编程语言

在​J​a​v​a​S​c​r​i​p​t​中​可以使​用​类的p​r​o​t​o​t​y​p​e属性来​扩​展​类的属​性​和​方​法，在实际开发当中，当JavaScript内置的那些类所提供的动态方法和动态属性不满足我们实际开发时，我们就可以通过 prototype 属性给自定义类添加方法和属性或者扩展原有的类中的方法和属性。

一、扩展JavaScript内置类，添加动态方法

语法格式：

类名.prototype.方法名 = function([param1],[param2], .[paramn]) {

..

}

[param1],[param2], .[paramn]这些参数都是可选的

使用这种方式给类添加的扩展方法都是动态的，动态方法是针对类的实例对象的，所以调用必须要用 对象.方法名 的形式去调用，不能用 类名.方法名 的形式去调用！

1.1、使用prototype属性扩展String类

String类是JavaScript内置的一个类，但是这个String类没有quote方法，此时就可以使用String类的prototype属性去扩展String类了，为String类添加一个实例方法(动态方法)，这样每一个String类对象就都有quote方法了，这就达到了将String类扩展的效果，增强了String类的使用。

1 /*扩展为String类，为String类增加quote（两边加字符）方法*/ 

2 String.prototype.quote = function(quotestr) { 

3 if (!quotestr) { 

4 quotestr = "/""; 

6 return quotestr + this + quotestr; 

7 };

测试String类新添加的quote方法

1 alert("abc".quote()); 

2 alert("abc".quote("|"));

测试结果：

1.2、使用prototype扩展Number类

1 Number.prototype.add=function(n){ 

2 //哪个对象调用this所在的函数，那么this代表的就是哪个对象实例 

3 return this+n; 

4 }

测试Number类新添加的add方法

1 var i= new Number(10);//等价于var i=10; 

2 alert("i.Add(10).Add(30)的结果是："+i.Add(10).Add(30)); 

3 var b=40; 

4 alert("b.Add(90)的结果是："+b.Add(90));

测试结果：

1.3、使用prototype扩展Array类

 1 Array.prototype.findVal=function(val){ 

 2 var index=-1; 

 3 //哪个对象调用this所在的函数，那么this代表的就是哪个对象实例 

 4 for(var i=0;i this.length;i++){ 

 5 if(val==this[i]){ 

 6 index=i; 

 7 break; 

 8 } 

 9 } 

10 return index; 

11 }

测试Array类新添加的findVal方法

1 var arr = new Array(); 

2 arr[0]="孤傲苍狼"; 

3 arr[1]="白虎神皇"; 

4 arr[2]="灭世魔尊"; 

5 alert("arr.FindVal(/"白虎神皇/")返回的索引是："+arr.FindVal("白虎神皇"));

测试结果：

以上三个小例子就是使用类的prototype属性扩展了String类，Number类，Array类，分别给这三个类添加了本身不存在的quote，add，findVal方法，JavaScript所有的类都可以使用prototype去扩展，当觉得类本身提供的方法和属性不满足实际应用需求时，就可以根据需要进行扩展，为类添加新的方法和属性，增强类的使用功能！

二、扩展JavaScript内置类，添加静态方法

JavaScript是可以给类添加静态的扩展方法的，语法格式如下：

类名.方法名 = function([param1],[param2], .[paramn]) {

..

}

[param1],[param2], .[paramn]这些参数都是可选的

使用这种方式给类添加的扩展方法都是静态的，动态方法是针对类的实例对象的，所以调用必须要用 对象.方法名 的形式去调用，而静态方法是针对类的，用 类名.方法名 的形式去调用！

C#中的String类有一个静态的Format方法非常强大，在拼接字符串时特别方便，JavaScript的String类并没有Format方法，但是我们可以去扩展String类，为String类添加类似C#中的String类的静态的Format方法

范例：扩展String类，添加Format静态方法，模仿C#中的String.Format方法

 1 // ---------------------------------------------------------------------- 

 2 // summary 

 3 // 扩展String类，添加Format静态方法，模仿C#中的String.Format方法 

 4 // /summary 

 5 // returns str /returns 

 6 // ---------------------------------------------------------------------- 

 7 if (!String.Format) { 

 8 String.Format = function () { 

 9 if (arguments.length == 0) { 

10 return null; 

11 } 

12 var str = arguments[0]; 

13 if (arguments[1] instanceof Array) { 

14 var arr = arguments[1]; 

15 for (var i = 0; i arr.length; i++) { 

16 var re = new RegExp(//{ + i + //}, gm); 

17 str = str.replace(re, arr[i]); 

18 } 

19 } else { 

20 for (var i = 1; i arguments.length; i++) { 

21 var re = new RegExp(//{ + (i - 1) + //}, gm); 

22 str = str.replace(re, arguments[i]); 

24 } 

25 } 

26 return str; 

27 } 

28 }

测试为String类扩展的Format静态方法

1 var str="我是{0}，我在总结{1}和{2}的学习，我很喜欢{3}这2门语言!"; 

2 //使用"类名.方法名"的形式去调用类的静态方法 

3 str = String.Format(str,"孤傲苍狼","java","JavaScript","java和JavaScript");//把str中的占位符{0}，{1}，{2}，{3}用具体的内容替换掉 

4 alert(str);

运行结果：

这个小例子就是扩展了String类，给String类添加了一个静态的Format方法，JavaScript所有的类都可以添加静态扩展方法，当觉得类本身提供的静态方法和静态属性不满足实际应用需求时，就可以根据需要进行扩展，为类添加新的静态方法和静态属性，增强类的使用功能！

以上就是对JavaScript编写类的扩展方法的总结，大家可以根据实际情况对JavaScript内置的那些类编写扩展方法，满足在开发中实际需求！有一个比较著名的prototype.js库就是针对JavaScript内置的那些类进行扩展，编写了大量的扩展方法！学习编写JavaScript扩展方法时，可以去多多参考prototype.js的写法，我本人现在也在看prototype.js的源码，过段时间再和大家分享我的心得吧！文章中如果有写得不对的地方，欢迎朋友们指正，感激不尽！

原创文章，作者：ItWorker，如若转载，请注明出处：https://blog.ytso.com/11424.html

cgojavamacphpxml