What is the uneval function for?

Question

I was seeing some things in Javascript (which seems new to me) and I came across an example that showed a function called uneval.

Some questions below about her:

• This function is new in Javascript (we are in 2018)?

• She does the "opposite" of eval?

• I also read that it should not be used in production. Using it brings some risk to my application?

• It works on which browsers?

Answer 1

Answer: for nothing practical.

Given the content on the Internet, I believe the function uneval has been created by the Mozilla team under some internal demand and ended up leaving the function there - maybe Firefox even use it for something.

Compatibility

It is, in fact, exclusive to Firefox and is not foreseen in any current specification, so no kind of forecast or even if it is discussed to implement it in other browsers, so in practice, it really will not be useful - unless you have an application that runs exclusively on Firefox, such as a browser extension, for example.

Mobile is no different.

Function

But what does it do? Well, in a simplified way, it does the inverse of the function eval. As the eval builds an object from its representation as string, the function uneval builds a string representing an object. For example, when doing uneval(function foo(){}); the return will be to string "(function foo(){})" and, being a string, you can do anything that can be done with a string: display it on console, send via HTTP, etc. In PHP, there is the function var_export which has quite similar function.

For example, you could show the source code of a function in the console.log, along with an error message, to facilitate the debug or even feed some other kind of log - be aware that there are countless better ways to do this, so don’t do it like this:

Note: the example below will only work in Firefox for the above reasons.

function sum(a, b) {
  if (isNaN(a) || isNaN(b)) {
    throw "Desculpe, sei apenas somar números";
  }
  
  return a + b;
}

try {
  const result = sum(2, 'a');
} catch (error) {
  console.log('Falha na função sum(a, b):', error);
  console.log( uneval(sum) );
}

Thus, the exit in the console would be:

Falha na função sum(a, b): Desculpe, sei apenas somar números
function sum(a, b) {
  if (isNaN(a) || isNaN(b)) {
    throw "Desculpe, sei apenas somar números";
  }

  return a + b;
}

But, let’s face it, it’s not even such a useful application.

And the method Object.prototype.toString?

Both seem to do the same thing: return the representation in string of an object, however, the method toString does not care about generating a string which is a valid Javascript code, while the uneval yes. If you take the representation of both of a JS object it is easy to notice the difference:

const obj = new Object()

console.log(obj.toString())  // [object Object]
console.log(uneval(obj))  // ({})

To demonstrate the validity of Javascript code, simply apply the function eval:

console.log( eval(obj.toString()) )  // Erro
console.log( eval(uneval(obj)) ) // Object {  }

Although the combination eval+uneval recreates the object, it does not mean that they will be the same object.

obj == eval(uneval(obj))  // false