Eval is evil… So what should I use instead?

Question

An ajax request returns me a standard JSON array filled with my user\'s inputs. The input has been sanitized, and using the eval() function, I can easily create my javascrip

Answer 1

Issue: The problem eval poses is that it executes in the global scope

eval.call(document, "console.log(this)")
eval.call(navigator, "console.log(this)")
eval.call(window, "console.log(this)")
(function(){eval.call(document, "console.log(this)")})()
>Window

Scenario:

Assume you are using individual attributes in the markup code of various document-elements such as an attribute onvisible

You would like to get all elements with this attribute, turn the onvisible-content-string into a closure and put it into an EventHandler queue. This is where the JS Function constructor comes into play.

Function === 0..constructor.constructor
>true

Function('return [this, arguments]').call(window, 1,2,3)
>Window, Arguments[3]]
Function('return [this, arguments]').call(document, 1,2,3)
>Document, Arguments[3]]
Function('return [this, arguments]').call(navigator, 1,2,3)
>Navigator, Arguments[3]]    

Putting it all together:

var eventQueue = [];
var els = document.querySelectorAll('[onvisible]');

for (var el in els) {
    var jscode = els[el].getAttribute('onvisible');
    eventQueue.push( {el:els[el], cb:Function(jscode)} )
}

//eventQueue[0].cb.call(scope, args);