欢迎来到天天文库
浏览记录
ID:10755533
大小:59.12 KB
页数:5页
时间:2018-07-08
《javascript中的对象和原型(三)》由会员上传分享,免费在线阅读,更多相关内容在行业资料-天天文库。
1、Javascript中的对象和原型(三)作者: 念在三角湖畔 来源: 博客园 发布时间:2012-05-3110:39 阅读:29次 原文链接 全屏阅读 [收藏] 在Javascript中的对象和原型(二)中我们提到,用构造函数创建的对象里面,每个对象之间都是独立的,这样就会降低系统资源的利用率,解决这样问题,我们就要用到下面提到的原型对象。 一原型对象 原型对象实际上就是构造函数的一个实例对象,和普通的实例对象没有本质上的区别。可以包含特定类型的所有实例的共享属性或者方法。这样,如果我们需要修改所有实例中的属性或者方法,就只需要修改一
2、处,就能够影响到所有实例了。因为原型中的属性和方法是共享的。我们可以看下两个图示: 构造函数方式原型模式方式 从上面的图示中我们就不难看出,为何下面的代码中"user1.show==user2.show;"返回的是ture,因为show方法是所有由User构造函数创建的对象所共享的,而不是每个对象都各自创建了一个show方法。每个JavaScript函数都有prototype属性,这个属性引用了一个对象,这个对象就是原型对象。原型对象初始化的时候是空的,我们可以在里面自定义任何属性和方法,这些方法和属性都将被该构造函数所创建的对象继承。Prototype
3、,这个属性引用了一个对象,它又有一个属性,constructor,它的值是一个函数对象。 在原型中添加属性和方法可以参照如下代码:functionUser(name,age){//构造方法this.name=name;//对象属性this.age=age;}User.prototype.addr='湖北武汉';//在原型中添加属性User.prototype.show=function(){//在原型中添加方法alert(this.name+'
4、'+this.age);};varuser1=newUser('ZXC',22);//创建实例varuser2=n
5、ewUser('CXZ',21);user1.show();//调用show()方法user2.show();alert(user1.show==user2.show);//返回true说明show方法是共享的alert(user1.addr);//'湖北武汉'alert(user2.addr);//'湖北武汉' 但是有个问题是:如果我们既在构造方法中添加了一个属性、又在原型中添加了该属性,还在实例中添加了该属性,那么我们访问的究竟是哪一个属性呢?我们先看看下面的代码:functionUser(name,age){//构造方法this.name=name;/
6、/对象属性this.age=age;this.addr='湖北恩施';}User.prototype.addr='湖北武汉';//在原型中添加属性varuser1=newUser('ZXC',22);//创建实例varuser2=newUser('CXZ',21);alert(user1.addr);//'湖北恩施'deleteuser1.addr;//删除对象属性alert(user1.addr);//'湖北武汉'deleteUser.prototype.addr;alert(user1.addr);//'undefined'user2.addr='武汉';
7、alert(user2.addr);//'武汉' 从上面的代码可以看出,如果我们同时申明了对象属性、原型属性和实例属性,那么调用时显示的优先级应该是:实例属性>对象属性>原型属性。这就是采用了就近原则:调用时首先查找实例中是否直接定义了这个属性,有则返回实例属性;如果实例属性中没有就去构造函数中查找,有则返回;如果前面两者都没有就去原型对象中查找,如果没有则返回undefined。 二动态原型模式 有人可能会觉得上面代码中的写法感觉很别扭,因为原型中的方法和属性与构造函数中定义的对象属性和方法不在一块儿,要是能封装在一起就更加直观,如果要解决这个问题,就
8、要用到动态原型模式;//动态原型模式functionUser(name,age){//构造方法this.name=name;//属性this.age=age;this.addr='湖北恩施';User.prototype.addr='湖北武汉';//在原型中添加属性User.prototype.show=function(){//在原型中添加方法alert(this.name+'
9、'+this.age+'
10、'+this.addr);};}varuser1=newUser('ZXC',22);//创建实例varuser2=newUser('CXZ',21);us
11、er1.show();//调用show
此文档下载收益归作者所有