博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
浅谈JavaScript中的原型模式
阅读量:4286 次
发布时间:2019-05-27

本文共 1747 字,大约阅读时间需要 5 分钟。

    在JavaScript中创建对象由很多种方式,如工厂模式、构造函数模式、原型模式等:

//工厂模式function createPerson(name,age,job){	var o = new Object;	o.name = name;	o.age = age;	o.job = job;	o.sayName = function()	{		alert(this.name);	}		return o;}var person = createPerson('dw',20,'IT');

 

其等价的原型模式:

function Person(){}Person.prototype = {	name:"dw",	age:20,	job:"IT",	sayName:function()	{		alert(this.name);	}};var person2 = new Person;
    在Javascript中,每个函数都有prototype属性,该属性是一个指向原型对象的指针,可以用于创建所有实例共享的属性的和方法。在原型模式下,在创建一个实例person3

var person3 = new Person;person2.name;  //dwperson3.name; //dw
person2和person3的name属性都返回dw。原型对象的属性和方法被所有特定类型的实例共享。在默认的情况下,每个原型对象会自动获得一个constructor属性,用于指向prototype属性所在函数的指针,如Person.prototype.constructor指向Person

alert(Person.prototype.constructor);   //返回Person的构造函数//Person.prototype.constructor只是指向Person的一个指针,与Person并不相等//以下均返回falsealert(Person.prototype.constructor === Person)alert(Person.prototype.constructor == Person)
实例、原型对象、构造函数的三角恋关系如下图所示:

在每一个实例的内部都有一个指针指向原型对象,在ECMA-262的第五版称之为[[prototype]]。在原型模式下创建的实例与构造函数没有直接的关系。

     虽然无法访问[[prototype]],但可以用isPrototypeOf()方法来确定对象是否是原型对象。

alert(Person.prototype.isPrototypeOf(person2)); //truealert(Person.prototype.isPrototypeOf(person3));//true
因为在实例内部均有一个指向Person.prototype的指针,所以均返回true。在ECMAScript 5中,可以用Object.getPrototypeOf()返回[[prototype]],即返回原型对象

alert(Object.getPrototypeOf(person2) == Person.prototype);  //truealert(Object.getPrototypeOf(person2).name); //dw
    注意:虽然可以用实例访问原型中的值,但是不能通过实例重写原型中的值,即实例中添加了与原型中同名的属性,则原型的同名属性被屏蔽。

person2.name="qs";alert(person2.name);//qs
即使将name属性设置为null,仍然不能访问原型中的name。可以用delete删除实例的name属性,则可以重新访问原型中的name.

person2.name = null;alert(person2.name);  //null
delete person2.name;alert(person2.name); //dw

     对于同名属性,可以用hasOwnProperty("propertyName")方法检测属性是属于实例还是原型,该方法只有在给定的属性存在实例中时才返回true 

你可能感兴趣的文章
iOS 绘图Quartz2DQ绘制图片和文字
查看>>
iOS 绘图Quartz2d图片裁剪/加水印/截屏
查看>>
iOS touch事件的多点触控案例和获取touch的属性
查看>>
iOS ARC内存管理/strong weak copy assign 的用法与区别(一)
查看>>
iOS NSthread多线程的应用原理与总结
查看>>
iOS GCD多线程的使用
查看>>
iOS NSOperation多线程的使用与理解
查看>>
iOS之屏幕旋转调用的方法
查看>>
iOS之中打电话/发短息/发邮件/吊起QQ聊天的方法总结
查看>>
iOS之UIImageView和UIImage
查看>>
iOS OC原生的输入输出流结合socket实现即时通讯
查看>>
iOS AsynSocket实现即时通讯
查看>>
iOS VFL语言
查看>>
iOS UIPopoverController以及iOS9以后UIPopPresentationController的使用、封装到分类中
查看>>
宏定义
查看>>
OC中字符串的操作
查看>>
ios之NSFileManager文件操作
查看>>
iOS NSThread多线程枷锁
查看>>
ios/OC之调用系统相机录像、拍照、打开相册
查看>>
iOS中需要重新布局的几中情况调用的方法
查看>>