Simple function logger in JS nl

Door creator1988 op maandag 6 januari 2014 12:57 - Reacties (4)
Categorie: Frontend, Views: 4.466

Every now and then I end up in a code base where I don't have a clue about the flow yet; like today when testing out the new keyboard application that we're developing for Firefox OS. To see whether the flow is actually sane I plug in a simple function logger that allows me to see which functions are called and with what arguments.

JavaScript:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function log(args) {
    var STRIP_COMMENTS = /((\/\/.*$)|(\/\*[\s\S]*?\*\/))/mg;
    // stole this from http://stackoverflow.com/questions/1007981/how-to-get-function-parameter-names-values-dynamically-from-javascript
    function getParamNames(func) {
      var fnStr = func.toString().replace(STRIP_COMMENTS, '');
      var result = fnStr.slice(fnStr.indexOf('(')+1, fnStr.indexOf(')')).match(/([^\s,]+)/g);
      if(result === null)
         result = [];
      return result;
    }

    console.log(args.callee.name, getParamNames(args.callee).reduce(function(obj, k, ix) { 
      obj[k] = args[ix]; 
      return obj; 
    }, {}));
  }


Now you can take advantage of this by putting a call to this function on the first line of any function you want to trace:

JavaScript:
1
function a(b, c) { log(arguments); }


When calling the a function, it will log the function name and an object with argument names and values:

JavaScript:
1
2
a(4, 5);
// a { b: 4, c: 5 }


Remember to disable "use strict" because accessing callee is not permitted anymore.

Volgende: Simple EventEmitter in one line in javascript 01-'14 Simple EventEmitter in one line in javascript
Volgende: Simple async queue in javascript 01-'14 Simple async queue in javascript

Reacties



Door Tweakers user sfranken, dinsdag 7 januari 2014 02:46

Nice. Is "console" and "console.log" available everywhere though? I'd do something like this:


code:
1
2
3
if(typeof console ===  "object" && typeof console.log === "function") {
    // Console.log code goes here
}

[Reactie gewijzigd op dinsdag 7 januari 2014 02:47]


Door Tweakers user TheKirk, dinsdag 7 januari 2014 07:56

sfranken schreef op dinsdag 07 januari 2014 @ 02:46:
Nice. Is "console" and "console.log" available everywhere though? I'd do something like this:


code:
1
2
3
if(typeof console ===  "object" && typeof console.log === "function") {
    // Console.log code goes here
}

As far as I know, the 'console' object is available in both Google Chrome, Firefox and Firefox OS:

https://developer.mozilla.org/en-US/docs/Tools/Web_Console

Door Tweakers user creator1988, dinsdag 7 januari 2014 09:47

TheKirk schreef op dinsdag 07 januari 2014 @ 07:56:
[...]


As far as I know, the 'console' object is available in both Google Chrome, Firefox and Firefox OS:

https://developer.mozilla.org/en-US/docs/Tools/Web_Console
It's also available in IE when you have the developer tools (F12) open. At least that was the case in IE8. Maybe IE11 has it by default.

Reageren is niet meer mogelijk