javascript - Logging anonymous function in the chrome dev tools -


i have code this:

obj.addeventlistener('event', function(eventtype) { }); 

when debug in chrome web deveoper profiler, see anonymous function, rather see contents of eventtype.

is possible rename or wrap somehow, preferable in efficent way, without need of separate function each eventtype?

or maybe possible timestamp profiler it's possible in timeline can make distinction between different eventtypes?

thanks!

you want function name depend on arguments, "without need of separate function each eventtype"?
think impossible.
apparently function keeps name assigned @ creation.

try following:

var aaa = function() {     debugger; }; var bbb = aaa; delete aaa; (function(){ var ccc = bbb; ccc(); })(); 

when run above code, see "aaa" in debugger, , doubt it'll different in other parts of dev tools.

i though maybe 1 tamper arguments.callee:

var aaa = function() {     console.log(arguments.callee.name);     arguments.callee.name = 'bbb';     console.log(arguments.callee.name);     debugger; }; (function() {     var ccc = aaa;     console.log(ccc.name);     ccc.name = 'ccc';     console.log(ccc.name);     ccc(); })(); 

but logged 4 times nothing @ console, , it's same arguments.callee.prototype.constructor.name.
logging arguments.callee.prototype logs aaa {}, suggests name bound internally somehow.

so without creating additional functions, hardly possible. use one name function name, suggested in jlrishe's answer.

other that, have no choice create functions @ runtime.
not make them show different functions in profiler however, should have global object on assign created functions can reuse them.

i suggest following setup:

make actual handler function global, like:

function actualeventhandler(eventtype) { /* ... */ } 

have global object store on-the-fly created functions to:

var handlerfunctions = {}; 

and in assigned event handler function, check if function current event type exists , create function name based on type otherwise:

obj.addeventlistener('event', function(eventtype) {     if(handlerfunctions[eventtype] === undefined)     {         var ev = {};         ev[eventtype] = function(evtype)         {             actualeventhandler(evtype);         }         handlerfunctions[eventtype] = ev[eventtype];     }     handlerfunctions[eventtype](eventtype); }); 

since cannot create variable name string, i'm using temporary object ev here, function name ev.<whatever>. if not want prefix @ all, have use eval().

edit: seems in newer versions of chrome, trick temporary object no longer works, chrome displays ev.(anonymous function). can still eval though, provided eventtype valid function name:

obj.addeventlistener('event', function(eventtype) {     if(handlerfunctions[eventtype] === undefined)     {         var fn = null;         eval('fn = function ev_' + eventtype + '(evtype){ actualeventhandler(evtype); };');         handlerfunctions[eventtype] = fn;     }     handlerfunctions[eventtype](eventtype); }); 

then function show in stack trace prefixed ev_.

i don't know how reflected in profiler, , there still anonymous function around of them (the 1 passed addeventlistener - give name, i'm not sure help) , call actualeventhandler inside, should show different functions event types.


Comments