Creating Javascript Objects from a Template

Question

I want to create a javascript object from a template. The problem is that I don’t know how the template will look in advance. As a simple example, if I had a template function

template = function (data) { return { title: data.title } } 

then I could run template({ title: "Steve" }) and return the object

 { title: "Steve" } 

Because data.title not evaluated until I call the template function. But I am building an object based on user input, where the field names are unknown in advance and can be deeply nested anywhere in the object.

If I define an object that is returned in advance, then the data.title field in this example will already be evaluated and will not use the input data. For example, I want to be able to define a template object, for example

 obj = { title: this.title } 

then redefine the template as

 template = function () { return obj } 

and call template.call({title:"Steve"}) . But now I'm coming back

 { title: undefined } 

because this.title already rated when I defined obj . Perhaps I am approaching this incorrectly because I continue to come to the conclusion that I will have to change the function, strict it, modifying the line to include the this.title code and creating a new function from the line. But this seems like a simple terrible idea.

And moving an object looking for special values ​​to replace seems expensive and complicated. I was also looking for some kind of javascript template library but didn't find anything.

EDIT: To make it more clear that the input and template structure do not necessarily match, maybe I have a template that looks like

 template = function (data) { return { name: "Alfred", stats: { age: 32, position: { level: 10, title: data.title } } } } 

and call template({title:"Manager"}) to get

{"name": "Alfred", "stats": {"age": 32, "position": {"level": 10, "title": "manager"}}}

Answer 1

Therefore, I was able to solve this problem (ab) using functions as metadata to mark the values ​​that should be replaced in the template. This is made possible by two things:

• I only need valid JSON values, so I can confidently say that functions are not literal user input
• JSON.stringify has a replacement parameter that will move around the object and can be used to pass input to the template

Using a template generator like this

 var templateMaker = function (object) { return function (context) { var replacer = function (key, val) { if (typeof val === 'function') { return context[val()] } return val; } return JSON.parse(JSON.stringify(obj, replacer)) } } 

I create a template object, replacing the field names with functions that return the field name

 var obj = { name: "Alfred", stats: { age: 32, position: { title: function () { return 'title' }, level: function () { return 'level' } } } } 

then I create a template function, define my input and open it to the object

 var template = templateMaker(obj); var data = { title: "Manager", level: 10 } var rendered = template(data); 

and magically, the output of the object looks like

{ "name": "Alfred", "stats": { "age": 32, "position": { "title": "Manager", "level": 10 } } }

Answer 2

Perhaps engines like Mustache will help you with this.

You can define the template of your object in the line:

var template = '{ title: {{title}} }';

then visualize it with data and convert it to json:

 var data = {title: 'I am title'}; var obj = JSON.parse(Mustache.render(template, data)); 

UPDATE

I read your updated example, here is an example:

 var template = JSON.stringify({ name: "Alfred", stats: { age: 32, position: { level: 10, title: '{{title}}' } } }); var data = {title: 'I am title'}; var obj = JSON.parse(Mustache.render(template, data)); obj.stats.position.title == "I am title";