How to format the function body when using toString()

Question

Let's say I have this function from a minified JavaScript file:

function fn(){console.log('Lorem');console.log('Ipsum');}

I would like to get a pretty print, indented version when calling:

console.log(fn.toString());

Expected output :

function fn() {
    console.log('Lorem');
    console.log('Ipsum');
}

Instead of:

function fn(){console.log('Lorem');console.log('Ipsum');}

Anyway to do that?

Answer 1

JavaScript does not have a built-in function to do this. So, if you want to do pretty printing programmatically, you'll have to do it manually. To get the function´s source, there is a non-standard Function.prototype.toSource() function, which is only supported by Firefox, though. A very simple pretty-print function covering your example is:

function prettyPrint(source) {
  let formattedSource = fn.toSource ? fn.toSource() : "";

  // Add line breaks after curly braces and semicolons
  formattedSource = formattedSource.replace(/([{};])/g, "$1\n");

  // Add space after opening curly brace
  formattedSource = formattedSource.replace(/(\S)\{/g, "$1 {");

  // Indent lines ending with a semicolon
  formattedSource = formattedSource.replace(/^(.*?);/gm, "    $1;");

  return formattedSource;
}

console.log(prettyPrint(fn));

Having said the above, the different developer tools have integrated options to pretty print the JavaScript sources within their debuggers.

Firebug:

Firefox DevTools:

Chrome DevTools: