1) Missing semicolons 2) Copy/paste from Stackoverflow without understanding the code and expecting everything to work. 3) Writing code with no indentation 😁

"There is research that black-on-white is more readable, so I follow that". Would you mind sharing a link?

Yeah these are only prototypes so there could still be a few bugs. Anyway thanks for letting me know.

Combing a source code editor (ace.js) and visualisations created with d3.js to encode the various aspects within a source code document. Prototype 1 - https://js-scope-vis.aerobatic.io/ Prototype 2 - https://mute-pocket.aerobatic.io/ Prototype 3 - https://possible-thread.aerobatic.io/

The function nest() takes two parameters 1) el and 2) parent. The first time nest is called we pass a (first element of the array) and root to the function. Nest() creates a new object called node. Node then gets added to the parent parameter. Parent corresponds to root the first time the function is called. Then node is returned. A reference of node is actually returned and not a copy (THIS IS IMPORTANT). Therefore, when nest() gets called a second time the parent parameter is actually a reference to the first node object that was created in the previously called nest() function.

let list = ['a', 'b', 'c'] let root = {} let parent = null; for(let el of list) { if(parent === null) parent = nest(el, root) else { parent = nest(el, parent); } } function nest(el, parent) { let node = {} parent[el] = node; return node; } console.log(root); Output { a: { b: { c: {} } } }