当前位置:首页 > 日记 > 正文

对Javascript设计模式的原型模式介绍(object.create和原型)

对Javascript设计模式的原型模式介绍(object.create和原型)
原型模式描述
描述:使用原型实例复制和创建新的和可定制的对象;新对象不需要知道原始对象创建的具体过程;

过程:原型= >新protoexam = >克隆到新的对象;

使用相关代码:
复制代码代码如下所示:

函数原型(){

this.name =;

this.age =;

this.sex =;

}

prototype.prototype.userinfo =函数(){

返回个人信息,姓名:+ +这个名字+,年龄:+ +这个年龄+,性别:+ +;

}
现在您需要两个或更多个人信息内容:
复制代码代码如下所示:

新原型();

甲= object.create VaR(原);

person1.name =肖明;

person1.sex =男性;

person1.age = 35;

person1.userinfo();
var 2 = object.create(原);

person2.name =Xiaohua;

person2.sex =女性;

person2.age = 33;

person2.userinfo();
输出返回:
复制代码代码如下所示:

个人信息,姓名:肖明,年龄:35,性别:男

个人信息名称:Xiaohua,年龄:33性别:女性
原型模式通常用于抽象结构,但其内容几乎相同。可以自定义抽象内容。新的创作只需对原始对象稍加修改即可达到要求。
object.create使用说明
1 >。定义:创建一个对象,该对象可以指定原型对象,并且可以包含可选的自定义属性。

2 > object.create(原{,};可选属性),设置新对象的属性;
复制代码代码如下所示:

1。为了创建一个新对象的原型,必须为null;这个原始的如果创建的{新}或对象原型是有价值的;

2。属性:可选,结构为:

{

propfield:{

价值:('val| { } { } |功能),

可写的:真正的|假,

枚举:真正的|假,

配置:真正的|假,

获取:函数(){返回10 },

设置:函数(值){ }

}

}

自定义属性具有以下四个属性:

值:自定义属性值;

写:该项的值是可编辑的,默认的是虚假的,当它是真的,obj.prodfield可以分配;否则,只读;

可以枚举枚举;

confirurable:可配置;

它也可以包括设置,get访问器方法;

其中,{集和}不能同时显示值和可写。
1。创建原型对象类:

复制代码代码如下所示:

函数的ProtoClass(){

这一组'protoclass;

这个;

此函数=(){

}

}
创建一个原型方法:

复制代码代码如下所示:

protoclass.prototype.amethod =函数(){



此(b);

把这个还给我;

}
使用方法

1。创建一个对象protoclass.prototype;

复制代码代码如下所示:

var obj1 = object.create(protoclass.prototype,{

福:{价值:'obj1 ',可写:true}

})
Obj1 has a method of ProtoClass prototyping, aMethod.

复制代码代码如下所示:

obj1.amethod();

将 /输出定义的访问,protoclass无法访问成员
但这种方法不执行成员A,B和C的属性,在ProtoClass:

2。使用实例化protoclass为原型:

复制代码代码如下所示:

VaR原=新ProtoClass();

var obj2 = object.create(原,{

福:{价值:'obj2}

});
这创造了obj2的所有protoclass、成员属性,B,C,和一种原型方法;并添加foo只读数据属性;

复制代码代码如下所示:

obj2,; / / protoclass

obj2。C: / / {物}

(obj2。B); / /

obj2.amethod(); / / protoclass

obj2.foo; / / obj2
三.子类继承:

复制代码代码如下所示:

函数子类(){
}

subclass.prototype = object.create(protoclass.prototype,{

福:{价值:'subclass}

});

subclass.prototype.submethod =函数(){

这一this.foo | |返回;

}
这种方法可以被继承的方法和执行的一种protoclass;

复制代码代码如下所示:

新子类();

Func.aMethod(); / /未定义,无法读取的protoclass、成员属性A,B,C

Func.subMethod(); / /子类
让子类来读取protoclass成员属性,子类是可以改变的:

复制代码代码如下所示:

函数子类()

{

protoclass.call(本);

}

其他代码;
这种方法可以获取该成员属性和方法protoclass原型;

复制代码代码如下所示:

新子类();

Func.aMethod(); / / protoclass

Func.subMethod(); / / protoclass
另一种方法是使用一个实例化的protoclass对象为原型的子类;

复制代码代码如下所示:

VaR原=新ProtoClass();

函数子类(){

}

subclass.prototype = object.create(原,{

福:{价值:'subclass}

});
当类被实例化时,所有属性和protoclass原型方法可以得到,和一个只读的数据属性,foo,创建。

复制代码代码如下所示:

新子类();

func.foo; / /子类

功能。一个; / / protoclass

(函数B);

Func

Func.aMethod(); / / protoclass
4。创建继承附加方法相同的成型效果object.create使用实例化的ProtoClass:

复制代码代码如下所示:

函数子类(){

this.foo = 'subclass '; / /但我能读和写

}

subclass.prototype =新ProtoClass();
object.create相关描述
object.create是用来创建一个新对象,当对象原型空新的(对象),并一致或{ };

当功能,效果,新函数名相同;

复制代码代码如下所示:

1对象

var

等效

VaR O2 = object.create({ });

两个构造函数;

/ / -----------------------------------------

函数(){

这一组'func;

}

func.prototype.method =函数(){

把这个还给我;

}

无功newfunc =新的功能();

等效{效果} /

无功newfunc2 = object.create(对象。原型 / *功能。原型| |函数(){ { } * /。

一:{价值:'func ',可写:true},

方法:{值:函数(){返回此};}

});
但newfunc和newfunc2不同于函数引用,创建自己的对象。

newfunc是函数func(){…},和newfunc2是函数{本地}

复制代码代码如下所示:

object.create(原propertiesfield {,}):
普罗托解释该值是必需的,可以是null,如果没有设置,就会抛出一个异常。

原型是非空的,也就是说,已经实例化的值,即新的值。Javascript中的大多数对象都有构造函数属性,它指示通过哪个函数实例化哪个对象。

propertiesfield是选择集的成员属性或方法,新创建的对象可能需要;

相关文章

青岛啤酒广告海报的冷凉PS合成

青岛啤酒广告海报的冷凉PS合成

青岛,海报,广告,电脑软件,PS,本教程是青岛啤酒广告海报用ps的合成方法来介绍冷酷,真的很好的教程合成效果,但是课程有点难,这不是很全面,所以需要有一些基本PS的朋友学习,不错,推荐,一起学习吧。 本教程是介绍使用PS酷酷夏合成青岛啤酒广告海报,效…

用js动态加载当前时间的方法

用js动态加载当前时间的方法

方法,动态加载,时间,电脑软件,js,本文演示了js动态加载当前时间的方法,供大家参考,具体实现方法如下: 函数时间() { var现在=新日期(); VaR年= now.getyear(); 变量mName = now.getmonth()+ 1; Var dName = now.getDay () + 1; 无功daynr =((now.getdate()<10…

ai十分钟创建一个美丽的小渐变

ai十分钟创建一个美丽的小渐变

渐变,十分钟,一个美丽,电脑软件,ai,本教程是介绍给朋友的,用ai十分钟创建漂亮的渐变图标,这很适合初学者学习,但作者并没有详细介绍步骤。 本教程教AI学习者使用AI快速创建漂亮的渐变图标。教程通常很难,而且制作的图标很漂亮。教程的详细步骤…

PHP快速排序算法的详细解决方案

PHP快速排序算法的详细解决方案

解决方案,快速排序算法,详细,电脑软件,PHP,概念 这是百度百科全书的图片,非常形象: 快速排序算法是冒泡算法的优化。他的想法是第一个数组分割,把数值元素到一个临时数组的元素,小到另一个临时数组的值(分割点可以是任意一个元素的数组中的值,…

对JSsetInterval事件的简要讨论

对JSsetInterval事件的简要讨论

事件,简要,电脑软件,JSsetInterval,setInterval()方法的调用函数不断直到clearInterval()调用或关闭窗口返回的ID值,setInterval()可以作为clearInterval()方法的参数。 使用setInterval() setInterval(代码,毫秒{,郎)) 接下来的两参数的代码是你的js代…

PS使用频道快速拿起婚纱摄影教程

PS使用频道快速拿起婚纱摄影教程

教程,频道,拿起,婚纱摄影,快速,本教程是介绍一个朋友到PS使用频道快速拿起婚纱照的方法。这个教程很好,也很基础。非常适合初学者学习。推荐朋友一起学习。 本教程主要是介绍PS使用频道快速拍摄婚纱照的方法,教程很不错,推荐大家一起学习! 图…

烟花纹理和纹理填充细节

烟花纹理和纹理填充细节

纹理,填充,烟花,细节,电脑软件,烟花纹理和纹理填充细节 我们应该什么时候使用纹理 首先,这是一个很主观的问题,首先应该由个人判断决定:例如,大面积的颜色,背景,需要相同的行距等等,对我来说,因为计算机内存和时间,克隆一个不好的方法。 其次,当我…

自定义页面编辑器FCKeditor的实现

自定义页面编辑器FCKeditor的实现

编辑器,方法,自定义,页面,电脑软件,萧边在这里提到的几篇文章为大家整理,他们的朋友会支持你。 一个长的文章页面,在控制页面插入手动编辑很麻烦,所以修改fck插入分页符: 改性的方法: 打开/编辑 找到fckeditorcode_gecko.js和fckeditorcode_i…

ps很快就创造了一个非常漂亮而漂亮

ps很快就创造了一个非常漂亮而漂亮

漂亮,文字效果,创造了,电脑软件,ps,本教程是向朋友介绍一个能快速漂亮美观的文本效果。这个教程很好。我建议你喜欢你的朋友一起学习。 本教程是为了快速创建一个非常漂亮而美观的文本效果方法,以ps为基础的教程,制作的文本非常漂亮,大家一起…

Javascript中多级链接下拉菜单的实现方法

Javascript中多级链接下拉菜单的实现方法

下拉菜单,多级,链接,方法,电脑软件,本文介绍了用javascript实现多级联动下拉菜单的方法,供大家参考,具体实现方法如下: 复制代码代码如下所示: 无功arritems1 =新的数组(); 无功arritemsgrp1 =新的数组(); arritems1 { 3 } =两列; arritemsgrp1 { 3 } …

焰火营造梦幻山水墨画效果

焰火营造梦幻山水墨画效果

焰火,山水,效果,梦幻,电脑软件,本教程是介绍给我的朋友,用烟花来营造效果的仿梦山水墨画。教程产生的效果非常好,难度也不是很大。我向你推荐它。希望你能喜欢。 本教程是介绍给我的朋友,用烟花来营造效果的仿梦山水墨画。教程产生的效果非常…

PS鼠标画漂亮的锤子手机时钟图标

PS鼠标画漂亮的锤子手机时钟图标

鼠标,图标,时钟,锤子,漂亮,本教程是一个锤子手机时钟图标PS鼠标画的漂亮介绍给朋友,渲染不是很难,但是很漂亮,推荐给朋友,爱一看。 本教程教学习者使用PS鼠标画PS鼠标快画漂亮的锤子手机时钟图标,渲染出时钟图标漂亮,渲染不难,推荐朋友分享学习,我…