How to evaluate custom javascript expression with the context in strict mode? - javascript

Update
I've come up with a concise solution to this problem, that behaves similar to node's vm module.
var VM = function(o) {
eval((function() {
var src = '';
for (var prop in o) {
if (o.hasOwnProperty(prop)) {
src += 'var ' + prop + '=o[\'' + prop + '\'];';
}
}
return src;
})());
return function() {
return eval(arguments[0]);
}
}
This can then be used as such:
var vm = new VM({ prop1: { prop2: 3 } });
console.assert(3 === vm('prop1.prop2'), 'Property access');
This solution overrides the namespace with only the identifier arguments taken.
Thanks to Ryan Wheale for his idea.
Short version
What is the best way to evaluate custom javascript expression using javascript object as a context?
var context = { prop1: { prop2: 3 } }
console.assert(3 === evaluate('prop1.prop2', context), 'Simple expression')
console.assert(3 === evaluate('(function() {' +
' console.log(prop1.prop2);' +
' return prop1.prop2;' +
'})()', context), 'Complex expression')
It should run on the latest version of node (0.12) and all evergreen browsers at the time of writing (3/6/2015).
Note: Most templating engines support this functionality. For example, Jade.
Long version
I'm currently working on an application engine, and one of its features is that it takes a piece of code and evaluates it with a provided object and returns the result.
For example, engine.evaluate('prop1.prop2', {prop1: {prop2: 3}}) should return 3.
This can be easily accomplished by using:
function(code, obj) {
with (obj) {
return eval(code);
}
};
However, the usage of with is known to be bad practice and will not run in ES5 strict mode.
Before looking at with, I had already written up an alternative solution:
function(code, obj) {
return (function() {
return eval(code);
}).call(obj, code);
}
However, this method requires the usage of this.
As in: engine.evaluate('this.prop1.prop2', {prop1: {prop2: 3}})
The end user should not use any "prefix".
The engine must also be able to evaluate strings like
'prop1.prop2 + 5'
and
'(function() {' +
' console.log(prop1.prop2);' +
' return prop1.prop2;' +
'})()'
and those containing calls to functions from the provided object.
Thus, it cannot rely on splitting the code string into property names alone.
What is the best solution to this problem?

I don't know all of your scenarios, but this should give you a head start:
http://jsfiddle.net/ryanwheale/e8aaa8ny/
var engine = {
evaluate: function(strInput, obj) {
var fnBody = '';
for(var prop in obj) {
fnBody += "var " + prop + "=" + JSON.stringify(obj[prop]) + ";";
}
return (new Function(fnBody + 'return ' + strInput))();
}
};
UPDATE - I got bored: http://jsfiddle.net/ryanwheale/e8aaa8ny/3/
var engine = {
toSourceString: function(obj, recursion) {
var strout = "";
recursion = recursion || 0;
for(var prop in obj) {
if (obj.hasOwnProperty(prop)) {
strout += recursion ? " " + prop + ": " : "var " + prop + " = ";
switch (typeof obj[prop]) {
case "string":
case "number":
case "boolean":
case "undefined":
strout += JSON.stringify(obj[prop]);
break;
case "function":
// won't work in older browsers
strout += obj[prop].toString();
break;
case "object":
if (!obj[prop])
strout += JSON.stringify(obj[prop]);
else if (obj[prop] instanceof RegExp)
strout += obj[prop].toString();
else if (obj[prop] instanceof Date)
strout += "new Date(" + JSON.stringify(obj[prop]) + ")";
else if (obj[prop] instanceof Array)
strout += "Array.prototype.slice.call({\n "
+ this.toSourceString(obj[prop], recursion + 1)
+ " length: " + obj[prop].length
+ "\n })";
else
strout += "{\n "
+ this.toSourceString(obj[prop], recursion + 1).replace(/\,\s*$/, '')
+ "\n }";
break;
}
strout += recursion ? ",\n " : ";\n ";
}
}
return strout;
},
evaluate: function(strInput, obj) {
var str = this.toSourceString(obj);
return (new Function(str + 'return ' + strInput))();
}
};

UPDATE 3: Once we figured out what you are really asking, the question is clear: you do not do that. Especially in the strict mode.
As an viable alternative to your approach please refer to the documentation on require.js, common.js and other libraries allowing you to load modules in the browser. basically the main difference is that you do not do prop1.prop2 and you do context.prop1.prop2 instead.
If using context.prop1.prop2 is acceptable, see jsfiddle: http://jsfiddle.net/vittore/5rse4jto/
"use strict";
var obj = { prop1 : { prop2: 'a' } }
function evaluate(code, context) {
var f = new Function('ctx', 'return ' + code);
return f(context)
}
alert(evaluate('ctx.prop1.prop2', obj))
alert(evaluate(
'(function() {' +
' console.log(ctx.prop1.prop2);' +
' return ctx.prop1.prop2;' +
'}) ()', obj))
UPDATE: Answer to original question on how to access properties with prop1.prop2
First of all, you can access your variable using dictionary notation, ie:
obj['prop1']['prop2'] === obj.prop1.prop2
Give me several minutes to come up with example of how to do it recursively
UPDATED:This should work (here is gist):
function jpath_(o, props) {
if (props.length == 1)
return o[props[0]];
return jpath_(o[props.shift()], props)
}
function jpath(o, path) {
return jpath_(o, path.split('.'))
}
console.log(jpath(obj, 'prop1.prop2'))

Related

Why this JavaScript code doesn't work?

I have for loop which goes through the array with arguments. When next argument is "?", "&" or "||", it shouldn't add comma, however, it always adds. I couldn't understand why, here is the code:
var args = ["arg1","arg2","?","arg3"];
var query = "";
for (var i = 0; i < args.length; i++) {
switch (args[i]) {
case "?":
query += " where ";
break;
case "&":
query += " and ";
break;
case "||":
query += " or ";
break;
default:
if (args[i+1] != "?");
{
query += args[i] + ", ";
break;
}
query += args[i] + " ";
break;
}
}
document.write(query);
When I type this (this is splitted by " " and sent to array args):
arg1 arg2 ? arg3
It prints it like this:
arg1, arg2, where arg3, // while it should be arg1, arg2 where arg3,
Thanks for helping people, problem was caused by an extern script. And yes, I removed semicolon ;)
Your if statement is broken:
if (args[i+1] != "?"); // <---- remove that semicolon
{
query += args[i] + ", ";
break;
}
You've got a stray semicolon. It is not a syntax error, but it means the if doesn't do anything. The code that adds the comma always runs, and exits the switch before the code that doesn't add the comma.
You have a semicolon between your if and your block:
if (args[i+1] != "?");
Should be
if (args[i+1] != "?")
There may be completely different ways to solve this problem which would make your code easier to extend without deepening trees of if or switch
A quick example,
// define some dictionaries
let logicDict = Object.assign(Object.create(null), {
'?': 'where',
'&': 'and',
'||': 'or'
});
// define some flags
let noComma = false;
// reduce your array
['arg1', 'arg2', '?', 'arg3'].reduceRight((str, e) => {
if (e in logicDict) {
noComma = true;
return logicDict[e] + ' ' + str;
}
if (!noComma) e += ',';
noComma = false;
return e + ' ' + str;
}, '').slice(0, -1);
// "arg1, arg2 where arg3,"
Thanks for noticing semicolon guys, problem was caused by an extern script.

Recursive Function not working correctly

I have a recusive function that is supposed to loop through a json object and output the expression. However, my recusion seems to be off because it's outputting field1 != '' AND field3 == '' when it should be outputting field1 != '' AND field2 == '' AND field3 == ''
I've tried a couple different things and the only way I can get it to work is by creating a global variable outstring instead of passing it to the function. Where am I off? When I step through it, i see a correct result but once the stack reverses, it start resetting outstring and then stack it back up again but leaves out the middle (field2).
JSFiddle
function buildString(json, outstring) {
var andor = json.condition;
for (var rule in json.rules) {
if (json.rules[rule].hasOwnProperty("condition")) {
buildString(json.rules[rule], outstring);
} else {
var field = json.rules[rule].id;
var operator = json.rules[rule].operator;
var value = json.rules[rule].value == null ? '' : json.rules[rule].value;
outstring += field + ' ' + operator + ' ' + value;
if (rule < json.rules.length - 1) {
outstring += ' ' + andor + ' ';
}
}
}
return outstring;
}
var jsonObj = {"condition":"AND","rules":[{"id":"field1","operator":"!= ''","value":null},{"condition":"AND","rules":[{"id":"field2","operator":"== ''","value":null}]},{"id":"field3","operator":"== ''","value":null}]};
$('#mydiv').text(buildString(jsonObj, ""));
The function has a return of a string.
When you call the function recursively from within itself, you aren't doing anything with the returned string from that instance, just calling the function which has nowhere to return to
Change:
if (json.rules[rule].hasOwnProperty("condition")) {
buildString(json.rules[rule], outstring);
}
To
if (json.rules[rule].hasOwnProperty("condition")) {
// include the returned value in concatenated string
outstring += buildString(json.rules[rule], outstring);
}
DEMO
Why so complicated?
function buildString(obj) {
return "condition" in obj?
obj.rules.map(buildString).join(" " + obj.condition + " "):
obj.id + " " + obj.operator + " " + string(obj.value);
}
//this problem occurs quite often, write a utility-function.
function string(v){ return v == null? "": String(v) }

Javascript object serialization function

I need a function that can serialize object of type {"a":"val", "b":{}, "c":[{}]} without JSON.stringify (cause the environment simply does not has JSON object) or using jquery and any other library. The code bellow is what I have at this moment:
function objToString(obj) {
if (obj == null) return null;
var index = 0;
var str = '{';
for (var p in obj) {
if (obj.hasOwnProperty(p)) {
str += index != 0 ? "," : "";
str += '"' + p + '":' + (typeof (obj[p]) == 'object' ? objToString(obj[p]) : itemToJsonItem(obj[p]));
index++;
}
}
str += "}";
return str;
}
function itemToJsonItem(item) {
return isNaN(item) ? '"' + item + '"' : item;
}
This function can deal with objects, nested objects but not with arrays. Node "c" from mentioned object will looks like "c":{"0":{...}} and not like array. Unsurprising "c".constructor === Array is false cause it interpreted as function and not as array. This is complete code where you can see what happens.
<div id="div_result"></div>
<script>
var test = { "a": "val", "b": [{"c":"val c"}]};
function objToString(obj) {
if (obj == null) return null;
var index = 0;
var str = '{';
for (var p in obj) {
if (obj.hasOwnProperty(p)) {
str += index != 0 ? "," : "";
str += '"' + p + '":' + (typeof (obj[p]) == 'object' ? objToString(obj[p]) : itemToJsonItem(obj[p]));
index++;
}
}
str += "}";
return str;
}
function itemToJsonItem(item) {
return isNaN(item) ? '"' + item + '"' : item;
}
document.getElementById("div_result").innerHTML = objToString(test);
</script>
I will really appreciate help, at this moment serialized object created by toSerialize function inside of each object but we want to make it with outside standard function.
Try to use JSON 3. It is polyfill library for window.JSON. It exposes JSON.stringify and JSON.parse methods.

JavaScript and extending 3rd party API

I'm updating my knowledge about JavaScript and I stuck on one lesson task.
I have API that is returning string...
API.workerName = function (worker) {
return worker.firstName + ' ' + worker.lastName;
};
The task is to prefix returning string and not change API, but extend it. I also have to avoid copying & pasting code, because 3rd party code can change. I should re-use it instead.
What I did is change this function after loading API...
API.workerName = function (worker) {
return '(' + worker.position + ') ' + worker.firstName + ' ' + worker.lastName;
};
... but I think I did it wrong.
To extend the method, you should save the old definition and call it from your extension:
API.oldWorkerName = API.workerName;
API.workerName = function(worker) {
return '(' + worker.position + ')' + API.oldWorkerName(worker);
};
Or maybe this is what your lesson is looking for:
API.workerPositionAndName = function(worker) {
return '(' + worker.position + ')' + API.workerName(worker);
};
Another neat way to save the old definition and also make it unavailable to anybody else, would be to do something like this using IIFE to create a closure:
API.workerName = (function() {
var old = API.workerName; // this old version is only available inside your new function
return function(worker) {
return '(' + worker.position + ')' + old(worker);
}
})();
Here's an example:
API = {
workerName: function (worker) {
return worker.firstName + ' ' + worker.lastName;
}
};
API.workerName = (function () {
var old = API.workerName;
return function (worker) {
return '(' + worker.position + ')' + old(worker);
};
})();
alert(API.workerName({firstName: "Joe", lastName: "Blogs", position: "Lackey" }));

arguments.callee alternative in es6 for determining caller function [duplicate]

This question already has answers here:
How do you find out the caller function in JavaScript when use strict is enabled?
(5 answers)
Closed 2 years ago.
In framework, I'm developing, I've constructed mechanism, that allowed to define private and protected properties and methods.
The only ability, I found in ES5 specifications for doing that was using arguments.callee
like this:
descriptor.method = function () {
if (__callerIsProptected(arguments.callee.caller.caller, cls))
return value.apply(this, __defaults(_.values(arguments), defaults));
throw 'Attempt to call ' + access + ' method "' + cls._name + '::' + name + '"';
};
As far as in strict mode calls to arguments.callee and arguments.caller cause throwing of exceptions are there any convenient alternatives to do that?
Update - added whole called function code
function __descriptor(cls, type, name, descriptor, access) {
//protected private non-function descriptor.value is replaced by get/set pair
if (access !== 'public' && type == 'property') {
delete descriptor.value;
delete descriptor.writable;
_.isFunction(descriptor.get) || (descriptor.get = function () {
return this.__get(name);
});
_.isFunction(descriptor.set) || (descriptor.set = function (value) {
return this.__set(name, value);
});
}
//remove uselesses
if (_.isFunction(descriptor.get) || _.isFunction(descriptor.set)) {
delete descriptor.value;
delete descriptor.writable;
if (!_.isFunction(descriptor.get)) {
descriptor.get = function () {
return this.__get(name);
};
}
if (!_.isFunction(descriptor.set)) {
descriptor.set = function (value) {
return this.__set(name, value);
};
}
} else {
delete descriptor.get;
delete descriptor.set;
}
if (descriptor.get) {
var getter = descriptor.get;
//mutate getter and setter if given respectively to access level
if (access === 'public') {
descriptor.getter = function () {
return getter.apply(this, arguments);
};
} else if (access === 'protected') {
descriptor.getter = function () {
if (__callerIsProptected(arguments.callee.caller.caller, cls))
return getter.apply(this, arguments);
throw 'Attempt to get ' + access + ' property "' + cls._name + '::' + name + '"';
};
} else if (access === 'private') {
descriptor.getter = function () {
if (__callerIsPrivate(arguments.callee.caller.caller, cls))
return getter.apply(this, arguments);
throw 'Attempt to get ' + access + ' property "' + cls._name + '::' + name + '"';
};
}
descriptor.getter._class = cls;
}
if (descriptor.set) {
var setter = descriptor.set;
//mutate getter and setter if given respectively to access level
if (access === 'public') {
descriptor.setter = function () {
return setter.apply(this, arguments);
};
} else if (access === 'protected') {
descriptor.setter = function () {
if (__callerIsProptected(arguments.callee.caller.caller, cls))
return setter.apply(this, arguments);
throw 'Attempt to set ' + access + ' property "' + cls._name + '::' + name + '"';
};
} else if (access === 'private') {
descriptor.setter = function () {
if (__callerIsPrivate(arguments.callee.caller.caller, cls))
return setter.apply(this, arguments);
throw 'Attempt to set ' + access + ' property "' + cls._name + '::' + name + '"';
};
}
descriptor.setter._class = cls;
}
if (descriptor.value !== undefined) {
if (!_.isFunction(descriptor.value)) return descriptor;
var value = descriptor.value;
var defaults = descriptor.defaults || [];
if (access === 'public' && type == 'method') {
descriptor.method = function () {
return value.apply(this, __defaults(_.values(arguments), defaults));
};
} else if (access === 'protected') {
descriptor.method = function () {
if (__callerIsProptected(arguments.callee.caller.caller, cls))
return value.apply(this, __defaults(_.values(arguments), defaults));
throw 'Attempt to call ' + access + ' method "' + cls._name + '::' + name + '"';
};
} else if (access === 'private') {
descriptor.method = function () {
if (__callerIsPrivate(arguments.callee.caller.caller, cls))
return value.apply(this, __defaults(_.values(arguments), defaults));
throw 'Attempt to call ' + access + ' method "' + cls._name + '::' + name + '"';
};
}
descriptor.method._class = cls;
}
return descriptor;
}
Once I was developing same framework (abandoned) and the only way to figure out a caller in strict mode was to actually throw an exception and RegExp caller name from stack trace. As far as I remember it wasn't always precise. Look for example at the code of caller-id script

Categories