宝哥软件园

Javascript面向对象(2)封装代码

编辑:宝哥软件园 来源:互联网 时间:2021-10-09

写一个小例子:第一步,在:做一个“手机类”。代码如下: var mobile phone=(function(){…………})()第二步考虑这个类,需要那些类的私有属性。我想在这里定义的是实例出来的手机数量。代码如下: var mobile phone=(function(){。//代表手机数量})()第三步:创建构造函数,即对实例期间生成的新图像进行初始化,如属性和方法的初始化;在这个例子中,每部手机都会有颜色、尺寸和价格的属性。这里的构造函数也是闭包,所以可以访问count,count的值会长期存储在内存中(只要有引用)。复制代码如下: var mobile phone=(function(){//private attribute var count=0;//代表手机数量//构造函数var creatphone=function(颜色、尺寸、价格){ count这个。_ color=color//手机这个的颜色。_ size=size//手机的大小这个。_价格=价格;//手机价格this.index=count//手机索引,也就是创建的手机手形}}))))第四步:共享方法:即实例中的所有手机对象都可以使用,其中手机应该可以更改价格、颜色和大小,还可以显示大小、颜色和价格。这里的常用方法应该放在“原型对象”:1。所有通过这个构造器实例的对象,也就是创建的手机,都可以使用“原型对象”中的方法。2.如果放在构造器里,每次手机对象出来,都会产生一堆重复的方法,占用内存。3.构造函数' :creatphone解释:因为CREATPhone。prototype={…}相当于覆盖了上一个原型对象的引用。为了将原型对象与构造函数相关联,设置了一个“构造函数”:creatphone,它是属性。复制代码如下: var mobile phone=(function(){//private attribute var count=0;//代表手机数量//构造函数var creatphone=function(颜色、尺寸、价格){ count这个。_ color=color//手机这个的颜色。_ size=size//手机的大小这个。_价格=价格;//手机价格this.index=count//手机索引,这是第一个创建的手机手形}//public方法,存储在prototype对象中,creat phone . prototype={ ' constructor ' : creat phone,//获取手机颜色' getcolor ' 3360 function(){ return this。_颜色;},//设置手机颜色' setcolor' :功能(颜色){this。_ color=color},//获取手机大小' getsize ' : function(){ return ' width : ' this。_ size.width' height : '这个。_ size.height},//设置手机大小' setsize' :函数(大小){this。_ size . width=size . width;这个。_ size . height=size . height;},//获取电话价格' getprice ' : function(){ return this。_价格;},//设置手机的价格'设置价格' :功能(价格){这个。_ price=price}}})))第五步:Privileged方法,也就是需要有一个方法来访问类的私有变量。

即有多少个手机对象复制码如下: varmobile phone=(function(){//private attribute var count=0;//代表手机数量。var索引=0;//代表手机的索引//构造函数var creatphone=function(颜色、大小、价格){ count这个。_ color=color//手机这个的颜色。_ size=size//手机的大小这个。_价格=价格;//手机价格this.index=count//手机索引,这是第一个创建的手机手形图像}//public方法,存储在原型对象creatphone中。prototype={ ' constructor ' : create phone,' getcolor ' : function(){ return this。_颜色;},' setColor' :函数(color){ this。_ color=color},' getSize' :函数(){ return 'width:' this。_size.width ' height: '这个。_ size.height},' setSize' :函数(大小){ this。_ size . width=size . width;这个。_ size . height=size . height;},' getPrice' :函数(){返回这个。_价格;},'设置价格' :函数(价格){this。_ price=price } }//特权方法creatphone。get _ count _ index=function(){ return count } return create phone;})()使用上面封装的手机类测试并复制代码如下: var any call=new mobile phone();//实例一三星手机对象var HTC=new mobile phone();//实例一个HTC手机对象var Iphone4s=new mobile phone();//实例一个苹果4S手机对象console . log(‘三星是第一个:‘any call . index’);//FF的控制台输出创建了哪个三星手机对象,即indexConsole.log('HTC为第一:' HTC . index ' Taiwan ');//FF控制台输出HTC手机对象是哪一个被创建的,即索引;Console.log('Iphone4s是第一个:' iphone 4s . index ');//FF的控制台输出创建了哪个苹果4S手机对象,即索引;Console.log('共' MobilePhone.get_count_index()'手机');//FF的控制台输出一共创建了几部手机;console . log(any call . constructor===mobile phone);//来自实例的对象的原始图像中的构造函数是否仍然指向MobilePhone如下,完全正确:

更多资讯
游戏推荐
更多+