[Ext源码]Ext的核心方法

本文详细解读了Ext.extend方法的工作原理及其在JavaScript框架中的应用,包括构造函数创建、原型继承、属性覆盖和方法扩展的核心机制,并通过示例展示了如何在实际开发中利用该方法提高代码效率。
摘要由CSDN通过智能技术生成
Ext.extend方法:

extend : function(){
// inline overrides
var io = function(o){
for(var m in o){
this[m] = o[m];//io的调用对象将获得o的所有属性
}
};
var oc = Object.prototype.constructor;//对象直接量的构造函数

return function(sb, sp, overrides){//子类、父类、做为子类添加属性源的直接量对象
if(Ext.isObject(sp)){//双参数,第一个是父类、第二个是对象直接量
overrides = sp;
sp = sb;
sb = overrides.constructor != oc ? overrides.constructor : function(){sp.apply(this, arguments);};
//对象直接量有构造函数则直接做为子类构造函数,没有则采用父类的构造方法
}
var F = function(){},
sbp,
spp = sp.prototype;//父类原型对象

F.prototype = spp;//F的原型与父类原型引用相同
sbp = sb.prototype = new F();//父类原型的新实例做为子类原型对象
sbp.constructor=sb;//为子类添加构造函数
sb.superclass=spp;//为构造函数添加属性superclass,此属性引用父类原型
if(spp.constructor == oc){//如果父类构造函数是直接量构造函数则将父类
spp.constructor=sp;
}
sb.override = function(o){//为子类构造函数添加override方法属性
Ext.override(sb, o);
};
sbp.superclass = sbp.supr = (function(){//为子类原型添加两个方法属性,作用都是返回父类原型对象
return spp;
});
sbp.override = io;//为子类原型添加override方法,作用跟构造函数的override方法相同,参数不一样罢了
Ext.override(sb, overrides);//重写子类的方法
sb.extend = function(o){return Ext.extend(sb, o);};//为子类构造函数添加extend方法
return sb;
};
}(),

该方法使用了自执行一个闭包,我们可以这样来理解这个闭包:首先,
function(){}()
该函数是个匿名自执行函数,也就是说在定义完成的时候这个函数就已经执行完毕了,在这里,该函数返回了一个Function对象,由于返回的Function对象对于自执行函数的调用对象(函数调用对象保存着函数的作用域链、参数、局部变量等信息)存在着引用(io和oc对象)自执行函数的调用对象将不再被垃圾回收,从而使得返回的Function对象拥有了该函数的作用域(自执行函数的作用域链将做为返回函数的上层作用域链而存在),这样做的结果就是使得io和oc保存在一个封闭的作用域中,所有返回的Function函数对象中存在的io和oc对象都是对同一对象的引用,最终结果就是减少了创建这两个对象所需要的时间和空间开销;其次,应该明白Ext.extend属性所指向的不是那个自执行函数,而是它所返回的Function对象,当你每次用调用函数的方式执行Ext.extend的时候(例如:Ext.extend(...))实际上执行的是自执行函数所返回的函数。
[b]该方法的核心作用:[/b]
1.为子类创建构造函数并将构造函数返回(返回的函数仅对于双参数的方法有用)
2.将子类原型属性指向父类实例,以使得子类原型拥有父类原型的全部属性;
3.使用Ext.override方法将直接量对象的属性赋予子类原型(同名方法将被覆盖);
4.为子类构造函数函数添加superclass属性,该属性指向父类原型对象(对于调用父类方法意义重大)
[b]附加作用:[/b]
1.子类原型的superclass和supr属性,这两个属性使得子类实例可以引用到父类的原型属性;
2.为子类构造函数添加extend和override方法;
[b]示例:[/b]
[img]http://dl.iteye.com/upload/attachment/245638/66011d88-d6cb-3bff-a85b-37a5f3a55c81.png[/img]
示例使用的是Chrome的javascript控制台,其中浅蓝色字体为输入部分
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值