论坛首页 Web前端技术论坛

关于function原型对象prototype的思考

浏览 1568 次
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
作者 正文
   发表时间:2010-03-13   最后修改:2010-03-13
今天在工作中碰到个很奇怪问题。
Ext.grid.GridView.prototype.templates的值一直随着对象改变。


首先是自己在js中对gridview的默认模板进行外部修改
Ext.grid.GridView.prototype.templates.cell=/*code*/ 



而Ext.grid.GridView在initTemplates的时候,首先判断是否存在,不存在则创建空对象
var ts=this.templates||{} 


之后对ts进模板初始化

ts.hcell==...

ts.master=...


造成结果是

var d=new Ext.grid.GridView({})
//d根据参数初始化模板

var e=Ext.grid.GridView({})
//e根据参数初始化模板的时候,由于上述原因,发现模板已经存在,则不创建

//最后d,e两个view配置参数完全不同,却用同一套模板,造成许多错误。


后做几个小试验

//直接对prototype中的value的属性进行操时。

var func_a=function(){};
func_a.prototype.value={x:10,y:20}

var obj_a=new func_a();
var obj_b=new func_a();

obj_a.value.x=100
alert(obj_b.value.x) //结果为100
alert(func_a.prototype.value.x ) //结果也为100


//结论,这种方式去运用prototype中的对象,是直接操作protoype的对象引用,并非每个对象独立对象属性




//不对prototype中的value中的属性直接操作时。


var func_a=function(){};
func_a.prototype.value=10

var obj_a=new func_a();
var obj_b=new func_a();

obj_a.value=100
alert(obj_b.value) //结果仍为10
alert(func_a.prototype.value ) //结果也为10

func_a.prototype.value.x=0;
alert(obj_a.value) //结果仍为100
alert(obj_b.value) //结果为0

//结论,这种方式去运用prototype中的对象,做法比较特别,首先如果对象未更改过基础类型的属性的值,那么仍然与“父类”指向同一个地址,如果“父类”通过“=”赋值,那么修改的是prototype地址中的值,而对象通过“=”赋值,则应为值拷贝。(解释为何obj_b值与func_a相同,而obj_a却不改变),

//再将value换成任何对象,结果一样,prototype.value不管指向任意对象,对应条件的obj_a,obj_b均跟随





   再延伸一下,ext中的javascript继承(Ext.extend),也是依靠prototype实现的。
要实现继承,最最基础的两个问题是:
   1.父类方法、属性更改,子类所有属性也修改。
   2.子类方法、属性更改,父类不更改。
//ext是这样做的
extend:function(subClass,superClass,overrides)
{
   var F=function(){};
   F.prototype=superClass.prototype;
   subClass.prototype=new F();
//   将overrides拷贝到subClass的prototype中
//这样做,根据之前对protoype的研究, “父类”修改,所有“子类”修改,因为 subClass.prototype相当于new superClass(),如果subClass.prototype一经修改,那么就脱离了superClass.prototype对其控制,所以不会影响到“父类”。 如果superClass.prototype进行修改,那么所有此“类”创造的对象,只要没有单独赋值,那么都会跟随“父类”一起更改。
  
}

ext这几句代码,就是extend实现的精华。
论坛首页 Web前端技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics