夏日博客

A-A+

ExtJs与JavaScript的call方法

2016年01月21日 前端设计 暂无评论 阅读 5 views 次

之前在教学视频有看过javascript的call。这个方法在ExtJs中是很常用的。 以前在搞ExtJs的时候总是忽略initComponent里面的一句代码，如下所示.

今天在看其他人代码的时候发现调用的函数和自己想像的不一样,所以认真看了一下代码,再结合之前js关于call的笔记,知道了其中的原因,代码如下:

Son.superclass.initComponent.call(this);

这里的call就是调用"Son"父类的initComponent函数,并把this传进去,这个this是Son的实例对象,下面用一个js代码解释一下这个call 是怎样的,代码如下:

  1. function Dog(name){  
  2.     this.name = name;  
  3. }  
  4. function test(){  
  5.     alert(this.name);  
  6. }  
  7. var dog = new Dog('lil');  
  8. test.call(dog);//这句话相当于dog.test();所以test()里面的this是dog,即this.name是dog.name,即弹出'lil'  

如上面代码所示,test.call(dog)等价于dog.test();

下面举ExtJs代码的例子,代码如下:

  1. Son = Ext.extend(Father,{  
  2.        initComponent : function() {  
  3. 　　　　　　Son.superclass.initComponent.call(this);//这里调用父类的initComponent方法，即Father的initComponent方法，并把this,Son的实例对象做为参数传过去  
  4.        },  
  5.        test : function() {  
  6.           alert('test in Son');  
  7. 　　　　}  
  8. }  
  9. Father = Ext.extend(Ext.Panel,{  
  10.        initComponent : function() {                      
  11. 　　　　　　Father.superclass.initComponent.call(this);  
  12.        　　this.test();//这里的this是Son的实例对象，相当于Son son = new Son();son.test();   
  13.        　　//所以调用的是子类的test方法而不是父类的test方法，我之前以为是调用父类的test方法         
  14.        },  
  15.       test : function() {  
  16.          alert('test in Father');  
  17. }  
  18. }  
标签：

给我留言