您的位置:首页 > 其它

.Ext源码解读之一 -- extend的实现

2013-01-10 17:52 288 查看
先看一个例子:
Gmis.ext.Animal = function() {
this.run = function() {
Gmis.util.printMessage("Animal run");
};
this.swim = function() {
Gmis.util.printMessage("Animal swimming");
};
this.shout = function() {
Gmis.util.printMessage("Animal shout");
}
};

Gmis.ext.Cat = Ext.extend(Gmis.ext.Animal, {
constructor : function() {
Gmis.ext.Cat.superclass.constructor.call(this);
},
run : function() {
Gmis.util.printMessage("Cat run");
}
});

var cat = new Gmis.ext.Cat();
cat.run();
cat.shout();


再看同样功能的第二个例子:

Gmis.ext.Animal = function(name) {
this.name = name;
};
Gmis.ext.Animal.prototype = {
run : function() {
Gmis.util.printMessage(this.name + " 2Animal run");
},
swim : function() {
Gmis.util.printMessage(this.name + " 2Animal swimming");
},
shout : function() {
Gmis.util.printMessage(this.name + " 2Animal shout");
}
};
Gmis.ext.Cat = function(name,age){
Gmis.ext.Cat.superclass.constructor.call(this,name);
this.age = age;
};

Ext.extend(Gmis.ext.Cat,Gmis.ext.Animal, {
run : function() {
Gmis.util.printMessage(this.name + " 2Cat run, age: " + this.age);
}
});

var cat = new Gmis.ext.Cat("jiafei",3);
cat.run();
cat.shout();

extend的源码:

extend : function(){
// inline overrides
var io = function(o){
for(var m in o){
this[m] = o[m];
}
};
var oc = Object.prototype.constructor;

return function(sb, sp, overrides){
if(typeof sp == 'object'){
//1、在我们的第一个例子中,会走这个分支的。
//实际上是把参数调整了下,overrides等于了第二个参数-字面量对象,
//	让sp等于了Gmis.ext.Animal,sb等于了字面量对象里的constructor(如果有的话)
//效果实际上跟第二个例子差不多。后边可以按照第二个例子讲解了
overrides = sp;
sp = sb;
sb = overrides.constructor != oc ? overrides.constructor : function(){sp.apply(this, arguments);};
}
//2、这个F的实例可就是子类原型哦
var F = function(){},
sbp,//子类的原型
spp = sp.prototype;//超类的原型
//3、F的原型等于了超类的原型
F.prototype = spp;
//4、子类的原型等于了F的一个实例
sbp = sb.prototype = new F();
//5、子类原型的构造函数设置为了子类本身,如果不设置??
sbp.constructor=sb;
//6、子类的superclass属性等于了超类的原型,这样就可以直接调用子类.superclass.constructor.call(this,xxx)了
sb.superclass=spp;
//7、如果超类原型的构造函数等于Object对象原型的构造函数,这里还要顺便再设置下超类原型的构造函数。
if(spp.constructor == oc){
spp.constructor=sp;
}
sb.override = function(o){
Ext.override(sb, o);
};
sbp.superclass = sbp.supr = (function(){
return spp;
});
sbp.override = io;
//8、把overrides里边的所有方法和字段全部拷到子类的原型中(记得是原型中),实际也是F对象的实例中
Ext.override(sb, overrides);
sb.extend = function(o){return Ext.extend(sb, o);};
return sb;
};
}(),//这里执行了哦,会返回一个function的


看下overrides:

override : function(origclass, overrides){
if(overrides){
var p = origclass.prototype;
Ext.apply(p, overrides);
if(Ext.isIE && overrides.toString != origclass.toString){
p.toString = overrides.toString;
}
}
}

转:/article/3798383.html
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: