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: {} } } }