js中自定义类和对象

上传人:xiao****1972 文档编号:83806219 上传时间:2019-03-01 格式:DOC 页数:12 大小:114.66KB
返回 下载 相关 举报
js中自定义类和对象_第1页
第1页 / 共12页
js中自定义类和对象_第2页
第2页 / 共12页
js中自定义类和对象_第3页
第3页 / 共12页
js中自定义类和对象_第4页
第4页 / 共12页
js中自定义类和对象_第5页
第5页 / 共12页
点击查看更多>>
资源描述

《js中自定义类和对象》由会员分享,可在线阅读,更多相关《js中自定义类和对象(12页珍藏版)》请在金锄头文库上搜索。

1、5 自定义类和对象 5.1 工厂方法 在ECMAScript中创建工厂方法,返回一个特定类型的对象,以此实现代码的简洁适用。functioncreateFruit()vartempFruit=newObject;tempFruit.name=apple;tempFruit.number=5;tempFruit.showName=function()alert(this.name);returntempFruit;varFruit1=creatFruit();varFruit2=creatFruit(); 在createFruit()中可以加入形参来传入参数的值。随着ECMAScript不断被规

2、范化,这种创建对象的方法已不再流行,一部分原因是语法上的,一部分原因是功能上的,如每个对象的实例都拥有属于自己的showName方法,给内存管理带来一定的开销。5.2 构造函数 选择一个类名,第一个字母大写,该类名即是构造函数的名称。创建一个构造函数和工厂方法比较类似,不同的是需要使用关键字new来创建对象的引用。使用构造函数的方式来创建对象和使用工厂方法有着相同的弊端。functionFruit(name,number)this.name=name;this.number=number;this.showName=function()alert(this.name);varFruit1=ne

3、wFruit(apple,5);varFruit2=newFruit(pear,3);5.3 使用 Prototype 使用prototype属性可以用来创建新的对象,首先需要一个空的构造函数建立类的名称,然后所有的属性和方法都直接分配到prototype属性中。functionFruit()Fruit.prototype.name=apple;Fruit.prototype.number=5;Fruit.prototype.showName=function()alert(this.name);varfruit1=newFruit();varfruit2=newFruit(); 但是,这样同

4、样存在一些缺点。首先,构造函数中没有参数,给初始化带来一些麻烦,其次,当一个属性指向的是一个对象而非方法时,该对象会被所有的实例所共享,任何一点改动都会影响到其他对象引用的使用。5.4 混合使用工厂方法和Prototype这个概念很简单:使用构造函数定义所有除方法外的属性,使用 prototype 定义对象的方法。这样每个方法只会被创建一次,每个对象都能拥有自己对象实例的属性。functionFruit(name,number)this.name=name;this.number=number;this.owner=newArray(Jerry,Terry);Fruit.prototype.s

5、howName=function()alert(this.name);varFruit1=newFruit(apple,5);varFruit2=newFruit(pear,3);5.5 动态 prototype 简单来说,这种方法就是使用了一个标识符来判断 prototype 是否已经被指向某个方法,从而保证这些方法只会被创建并指向一次。5.6 混合工厂方法 这种方法和经典的工厂方法及构造函数方法在对象方法内存管理上存在同样的问题,一般不建议使用该方法,除了某些特殊情况(XML in JavaScript中有这样的例子)。6 修改对象 使用prototype对象可以对对象进行修改。除了用户自

6、定义的对象外,ECMAScript原始对象也有prototype属性。直接使用 prototype可以给对象创建新的方法。Number.prototype.toHexString=function()returnthis.toString(16);variNum=10;alert(iNum.toHexString();/输出A 另外,使用prototype可以轻松修改已有的方法,让方法名指向新的方法。需要注意的是,指向新的方法后,原有的方法不再被任何对象使用,将会被垃圾回收器销毁,使得原有方法不再存在。比较安全的解决办法是,建立一个新的引用来保存原有的方法,然后再将原方法覆盖。 比较特殊的是,

7、ECMAScript中创建对象,在对象引用被创建后,可以给对象加入新的方法,并且可以立即在对象的引用中使用。这是ECMAScript的一个特性,但不推荐这样使用,以免带来不必要的麻烦,例如阅读理解、文档资料等。第一种方式: 工厂方法 能创建并返回特定类型的对象的工厂函数(factory function)。 Javascript代码 1. functioncreateCar(sColor) 2. varoTempCar=newObject; 3. oTempCar.color=sColor; 4. oTempCar.showColor=function() 5. alert(this.colo

8、r); 6. ; 7. returnoTempCar; 8. 9. varoCar1=createCar(); 10. varoCar2=createCar();function createCar(sColor) var oTempCar = new Object; oTempCar.color = sColor; oTempCar.showColor = function () alert(this.color); ; return oTempCar;var oCar1 = createCar();var oCar2 = createCar();调用此函数时,将创建新对象,并赋予它所有必要

9、的属性。使用此方法将创建car对象的两个版本(oCar1和oCar2),他们的属性完全一样。 使用此方法存在的问题: 1语义上看起来不像使用带有构造函数的new运算符那么正规。 2使用这种方式必须创建对象的方法。每次调用createCar(),都要创建showColor(),意味着每个对象都有自己的showColor()版本,事实上,每个对象都共享了同一个函数。 有些开发者在工厂函数外定义对象的方法,然后通过属性指向该方法。从而避免这个问题: Js代码 1. functioncreateCar(sColor) 2. varoTempCar=newObject; 3. oTempCar.colo

10、r=sColor; 4. oTempCar.showColor=showColor; 5. returnoTempCar; 6. 7. functionshowColor() 8. alert(this.color); 9. function createCar(sColor) var oTempCar = new Object; oTempCar.color = sColor; oTempCar.showColor = showColor; return oTempCar;function showColor() alert(this.color);在这段重写的代码中,在函数createCa

11、r()前定义了函数showColor().在createCar()内部,赋予对象一个已经指向已经存在的showColor()函数的指针。从功能上来讲,这样解决了重复创建对象的问题,但该函数看起来不像对象的方法。 所有这些问题引发了开发者定义的构造函数的出现。 第二种方式:构造函数方式 Js代码 1. functionCar(sColor) 2. this.color=sColor; 3. this.showColor=function() 4. alert(this.color); 5. ; 6. 7. varoCar1=newCar(red); 8. varoCar2=newCar(blue

12、);function Car(sColor) this.color = sColor; this.showColor = function () alert(this.color); ;var oCar1 = new Car(red);var oCar2 = new Car(blue);你可能已经注意到第一个差别了,在构造函数内部无创建对象,而是使用this关键字。使用new运算符调用构造函数时,在执行第一行代码前先创建一个对象,只有用this才能访问该对象。然后可以直接赋予this属性,默认情况下是构造函数的返回值(不必明确使用return运算符)。 这种方式在管理函数方面与工厂方法一样都存

13、在相同的问题。 第三种方式:原型方式 Js代码 1. functionCar() 2. 3. 4. Car.prototype.color=blue; 5. varoCar1=newCar(); 6. varoCar2=newCar();function Car() Car.prototype.color = blue;var oCar1 = new Car();var oCar2 = new Car();调用new Car()时,原型的所有属性都被立即赋予要创建的对象,意味着所有的Car实例存放的都是指向showColor()函数的指针。从语义上看起来都属于一个对象,因此解决了前面两种方式存在的两个问题。此外使用该方法,还能用instanceof运算符检查给定变量指向的对象类型。因此,下面的代码将输出true: alert(oCar instanceof Car); /outputs true 这个方式看起来很不错,遗憾的是,它并不尽如人意。 1首先这个构造函数没有参数。使用原型方式时,不能给构造函数传递参数初始化属性的值,因为car1和car2的属性都等于“red”。 2真正的问题出现在属性指向的是对象,而不是函数时。函数共享不会造成任何问题,但是对象却很少被多个实例共享的。 第四种方式:混合的构造函数/原型方式(推荐) 联合使用构造函数和原型方式,

展开阅读全文
相关资源
相关搜索

当前位置:首页 > 大杂烩/其它

电脑版 |金锄头文库版权所有
经营许可证:蜀ICP备13022795号 | 川公网安备 51140202000112号