JavaScript學習總結(十四)——JavaScript編寫類的擴展方法

　　在​J​a​v​a​S​c​r​i​p​t​中​能夠使​用​類的p​r​o​t​o​t​y​p​e屬性來​擴​展​類的屬​性​和​方​法，在實際開發當中，當JavaScript內置的那些類所提供的動態方法和動態屬性不知足咱們實際開發時，咱們就能夠經過"prototype"屬性給自定義類添加方法和屬性或者擴展原有的類中的方法和屬性。

1、擴展JavaScript內置類，添加動態方法

語法格式：

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

　　　　.................

　　}

　　[param1],[param2],....[paramn]這些參數都是可選的

　　使用這種方式給類添加的擴展方法都是動態的，動態方法是針對類的實例對象的，因此調用必需要用"對象.方法名"的形式去調用，不能用"類名.方法名"的形式去調用！

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 = "\"";
5             }
6             return quotestr + this + quotestr;
7         };

測試String類新添加的quote方法

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

測試結果：

1.二、使用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.三、使用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去擴展，當以爲類自己提供的方法和屬性不知足實際應用需求時，就能夠根據須要進行擴展，爲類添加新的方法和屬性，加強類的使用功能！

2、擴展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]);
23 
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的源碼，過段時間再和你們分享個人心得吧！文章中若是有寫得不對的地方，歡迎朋友們指正，感激涕零！