Search code examples
javascriptextjsextjs4extjs4.2

Ext JS: Get calling function's name


I'm curious to know if there's an Ext way of getting the calling function's name without having to use arguments.callee.caller (as that's been deprecated) and naming my functions. Let's say I have this code:

Ext.Loader.setConfig({
  enabled: true
});

Ext.define('Mixin', {
  logWarning: function logWarning() {
    console.log('warning: ' + this.$className + '::' + arguments.callee.toString());  // displays function logWarning() ...
    console.log('warning: '+ this.$className + '::' + arguments.callee.caller.toString());  // displays functions() ...
  }
});

Ext.define('My.Panel', {
  extend: 'Ext.panel.Panel',
  mixins: ['Mixin']
});

Ext.application({
  name: 'Test',
  launch: function() {
    Ext.define('MyPanel', {
      extend: 'My.Panel',
      width: 200,
      height: 300,
      initComponent: function() {
        this.callParent();
        this.logWarning();
      }
    });
    Ext.create('MyPanel', {
      renderTo: Ext.getBody()
    });
  }
});

In my logWarning function, the first console.log string shows me the function name because I named the function. However, in most Ext apps, the functions remain anonymous because there's no need, as I'm using the scope like this.logWarning, and it doesn't make sense to maintain the same two names in my code.

What I'd like to know is, is there a way of grabbing the calling function's name using some Ext function I'm unaware of? I can easily grab the className with this.$className, but I'm sure that's frowned upon...


Solution

  • Thanks to skirtle over on the Sencha Forums, I ended up using arguments.callee.caller.$name. It's not ideal, but it currently gets the job done... when/if it gets deprecated, I'll have to revisit this issue.

    EDIT

    This was written a long time ago, and I have since stopped using this property. Instead, I'm throwing an error and parsing the stack trace to get the method, as the original answer wasn't doing what I needed.