详细讲解js中静态对象和构造函数的区别

本文探讨了JavaScript中创建对象的不同方式,并深入解析了如何使用构造函数定义公有及私有属性和方法。通过实例展示了JSON对象与构造函数实例化对象之间的区别。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

平常我们会经常使用JSON形式,或者var obj=function(){}亦或function(){}这么几种对象的构建办法,有时会认为这是等价的办法,然而他们还有不同。

来看下下面的对比代码:

 Code
       
var objJson = {   op1: ' objJson option1 ' ,   fn1: function (){     alert( this .op1)   } }

在这种形式的声明下,你可以通过objJson.op1或者objJson.fn1()来直接访问内部的属性,这没有问题。但是如果是这样:

 Code
       
var objFn = function (){    this .op1 = ' objFn.op1 ' ;    this .op2 = function (){     alert( this .op1)   }; }

那么如果你直接objFn.op1或者objFn.op2()来访问内部的属性的话,就不行了,因为这个时候他还不是个对象。

所以我们需要将他实例化

 Code
       
var inst = new objFn(); alert(inst.op1); inst.op2();

这样就可以得到你想要的值了。

如果你想复制JSON形式的对象,很简单,但是有一个问题:

 Code
       
var newone = objJson; newone.op1 = ' changed ' ; alert( ' objJson.op1 ' );

你会发现原来的对象中的op1的值也发生了改变。但是如果使用的第二种的对象声明的办法,那么修改只是在实例的内部,不会影响其他的实例。

所以像JSON这样的静态对象适合在写一些常用的库的时候使用,有他自己的命名空间,谁也不会干扰到谁,而且方便使用。

构造函数的"公有""私有"属性

我们将上面的构造函数做一个修改:

 Code
       
var objFn = function (){    var pri1 = ' 私有变量 ' ;    this .op1 = ' 公共变量 ' ;    this .op2 = function (){     alert(pri1 ' , ' this .op1);   }; }; var o = new objFn(); alert( typeof o.pri1 ' , ' typeof o.op1); // undefined,string o.op2(); // 私有变量,公共变量

私有变量在对象外是不允许访问的,所有typeof以后是undefined。下面我们看看私有方法的访问:

 Code
       
var objFn = function (){ var pri1 = ' 私有变量 ' ; var pri2 = function (){ this .op2(); };    this .op1 = ' 公共变量 ' ;    this .op2 = function (){     alert(pri1 ' , ' this .op1);   };    this .acPri = function (){     pri2.call( this );   }; }; var o = new objFn(); o.acPri(); // 私有变量,公共变量

注意到这里因为JavaScript的闭包特性,我们通过公有方法acPri()调用私有方法pri2的时候需要使用call将程序的上下文传递进去,不过就是这个看起来绕来绕去的太晕,可以稍稍的包装一下:

 Code
       
var objFn=function(){ var my=this; var pri1='私有变量'; var pri2=function(){ my.op2(); };   this.op1='公共变量';    this.op2=function(){     alert(pri1 ',' this.op1);   };    this.acPri=function(){     pri2.();   }; }; var o=new objFn(); o.acPri();//私有变量,公共变量

当然最后的结果还是不变。

 
 
 
最新
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值