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 = "\"";
5 }
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]);
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的源码,过段时间再和大家分享我的心得吧!文章中如果有写得不对的地方,欢迎朋友们指正,感激不尽!

JavaScript学习总结(十四)——JavaScript编写类的扩展方法,布布扣,bubuko.com

时间: 2024-10-12 16:07:26

JavaScript学习总结(十四)——JavaScript编写类的扩展方法的相关文章

JavaScript学习总结(十二)——JavaScript编写类

在工作中经常用到JavaScript,今天总结一下JavaScript编写类的几种写法以及这几种写法的优缺点,关于JavaScript编写类的方式,在网上看到很多,而且每个人的写法都不太一样,经常看到的就是以下几种方式. 1.构造函数方式 用构造函数模拟"类",在其内部用this关键字指代实例对象. 基本语法: function 类名(){     this.属性名;//公共属性     var 属性名;//私有属性    /*凡是定义类的公共属性和公共方法都要使用this*/   

JavaScript学习总结(十六)——Javascript闭包(Closure)

原文地址: http://www.cnblogs.com/xdp-gacl/p/3703876.html 闭包(closure)是Javascript语言的一个难点,也是它的特色, 很多高级应用都要依靠闭包实现.很早就接触过闭包这个概念了,但是一直糊里糊涂的,没有能够弄明白JavaScript的闭包到底是什么,有什么用,今天 在网上看到了一篇讲JavaScript闭包的文章(原文链接), 讲得非常好,这下算是彻底明白了JavaScript的闭包到底是个神马东东以及闭包的用途了,在此写出来和大家分

C++语言学习(十四)——C++类成员函数调用分析

C++语言学习(十四)--C++类成员函数调用分析 一.C++成员函数 1.C++成员函数的编译 C++中的函数在编译时会根据命名空间.类.参数签名等信息进行重新命名,形成新的函数名.函数重命名的过程通过一个特殊的Name Mangling(名字编码)算法来实现.Name Mangling算法是一种可逆的算法,既可以通过现有函数名计算出新函数名,也可以通过新函数名逆向推导出原有函数名.Name Mangling算法可以确保新函数名的唯一性,只要命名空间.所属的类.参数签名等有一个不同,那么产生的

JavaScript学习总结(十五)——Function类

在JavaScript中,函数其实是对象,每个函数都是Function类的实例,既然函数对象,那么就具有自己的属性和方法,因此,函数名实际上也是一个指向函数对象的指针,不会与某个函数绑定. 一.函数的声明 方式一:常规方式 1 function sum1(num1,num2){ 2 return num1+num2 3 } 方式二:函数表达式 1 var sum2=function(num1,num2){ 2 return num1+num2; 3 }; 方式三:动态创建函数(这种方式用得不多)

JavaScript学习总结(十)——this关键字

1 <script type="text/javascript"> 2 function Person(){ 3 /*使用var 属性名定义的属性是类的私有属性,外界无法访问,要想被外界访问,就要使用公共方法*/ 4 var QQ="123456"; 5 var Email="[email protected]"; 6 7 /*使用this.属性名定义的属性就是类的公共属性,是可以被外界访问的*/ 8 this.Name="

Swift学习笔记十四:构造(Initialization)

类和结构体在实例创建时,必须为所有存储型属性设置合适的初始值.存储型属性的值不能处于一个未知的状态. 你可以在构造器中为存储型属性赋初值,也可以在定义属性时为其设置默认值.以下章节将详细介绍这两种方法. 注意: 当你为存储型属性设置默认值或者在构造器中为其赋值时,它们的值是被直接设置的,不会触发任何属性观测器(property observers). 一.基本语法 class Human{ var name :String init(){ name = "human" } init(n

laravel3学习笔记(十四)

原作者博客:ieqi.net ==================================================================================================== 运行时配置 在 Laravel3 中很多地方我们都可以看到“约定大于配置”的影子,我本人也很喜欢这种工程哲学尤其是在框架领域,当然这并不能代替所有的配置.我们知道 Laravel3 中,主要配置都写在 application/config 文件夹下,在应用逻辑中,往往

JavaScript学习笔记第一天——字符串连接的N种方法

Javascript 字符串的连接方法有多种,但效率却有很大区别. 1.逐个字符串相加 var arr = ['item 1', 'item 2', 'item 3', ...]; var list = ''; for (var i = 0, l = arr.length; i < l; i++) { list += '<li>' + arr[i] + '</li>'; } list = '<ul>' + list + '</ul>'; 这种最常见的,

JUnit4学习笔记(四):利用Rule扩展JUnit

一.Rule简介 Rule是JUnit4中的新特性,它让我们可以扩展JUnit的功能,灵活地改变测试方法的行为.JUnit中用@Rule和@ClassRule两个注解来实现Rule扩展,这两个注解需要放在实现了TestRule借口的成员变量(@Rule)或者静态变量(@ClassRule)上.@Rule和@ClassRule的不同点是,@Rule是方法级别的,每个测试方法执行时都会调用被注解的Rule,而@ClassRule是类级别的,在执行一个测试类的时候只会调用一次被注解的Rule 二.JU