callParent有什么用？

Question

我已经通过这个在线教程来了解Sencha touch的基本概念.现在,我确信我可以期待用我的知识开始为真实项目编码.

但是我对this.callParent(arguments)本教程中作者使用的功能有疑问.

我知道这个名字清楚地表明,"父类的这是被称为".
但我有类似的问题:( 与教程相关)

• 我们为什么要打电话给父班？
• 这会完全再次运行父类吗？

请帮助我理解callParent上面的教程.

我已经浏览了我无法理解的触摸文档.(对于作者的代码,解释似乎与我完全不同).

项目下载链接

Answer 1

正如您在问题中提到的那样this.callParent(arguments),在超类中调用适当的函数.

那就是this.callParent(arguments)在构造函数中调用调用正在扩展的超类的构造函数.

在你提到的教程中,这就是作者所做的.

launch: function () {
  //This line simply calls the super class(Ext.app.Controller) launch function  
  this.callParent(arguments);
  var notesStore = Ext.getStore("Notes");
  notesStore.load();
  console.log("launch");
},

 init: function () {
  // This line simply calls the super class(Ext.app.Controller) init function   
  this.callParent(arguments); 
  console.log("init");
 }

但是为什么他这样做,我不确定因为没有必要在该教程中调用Ext.app.Controller类init和launch函数.

让我举例说明

1)创建名为的超类 Main

Ext.define('MyApp.controller.Main', {
    extend: 'Ext.app.Controller',

    launch: function () {
       console.log("Main launch");
    },      

    init: function () {
       console.log("Main init");
    },    

    config: {

    } 
});

2)创建SubMain扩展的子类MyApp.controller.Main

Ext.define('MyApp.controller.SubMain', {
    extend: 'MyApp.controller.Main',

    launch: function () {
        this.callParent(arguments);
       console.log("launch");
    },

     init: function () {
        this.callParent(arguments);
       console.log("init");
     },

    config: {
    }
});

现在,当您运行应用程序时,我们放置在超级和子类中的console.log将在浏览器控制台中打印

产量

Main init 
Main init 
SubMain init 
Main launch 
Main launch
SubMain launch 

因为我们知道,当我们启动应用程序init和launch每个控制器的功能将被调用一次.

但是,你看到主init和Main启动功能被调用两次,为什么？

它再次被称为init和启动函数的原因是因为我们放置this.callParent(arguments);了init and launch函数SubMain,即再次调用init和Main(超类)类的启动函数.

还有更多,arguments在callParent功能上传递了什么

arguments是一个特殊参数.

现在,让我们举一个例子进行测试

Ext.define('Mail.controller.Messages', {
    extend: 'Ext.app.Controller',

    config: {
        refs: {
            viewer: 'messageviewer',
            messageList: 'messagelist'
        },
        control: {
            messageList: {
                itemtap: 'loadMessage'
            }
        }
    },

    loadMessage: function(item) {
        this.getViewer().load(item);
    }
});

Mail.controller.phone.Messagesclass extends Mail.controller.Messages,这简单地表示所有配置和函数都是继承的.

 Ext.define('Mail.controller.phone.Messages', {
    extend: 'Mail.controller.Messages',

    config: {
        refs: {
            main: '#mainPanel'
        }
    },

    loadMessage: function(item) {
        // Without this line loadMessage function of super class will not be invoked
        this.callParent(arguments);
        this.getMain().setActiveItem(1);
    }
});

现在,当上一个项目的用户选项卡messageList中loadMessage的功能Mail.controller.phone.Messages类就会被调用.

我们也放置this.callParent(arguments);了loadMessage函数,因此将调用第一Mail.controller.Messages类loadMessage函数,然后this.getMain().setActiveItem(1);行将运行.

如前所述loadMessage,Mail.controller.Messages只有this.callParent(arguments);在loadMessage函数中放入函数时才会调用函数Mail.controller.phone.Messages.

注意item参数只会传递给loadMessage函数Mail.controller.phone.Messages,但loadMessage函数Mail.controller.phone.Messages仍然会得到item参数,如何？

这是因为arguments你在类的功能中传递了this.callParent函数.loadMessageMail.controller.phone.Messages