I\'m at the point now where i really want to organize my code in a way that makes it more scalable and manageable. i want to get a better understanding of the MVC architectural
Looking at code has always been the best way for me to learn so I figured I would share these.
TODO mvc comparing many different JS MV* Frameworks
The above link compares all the JS mv* frameworks. This demo should particularly interest you,
Vanilla JS Todo mv* implementation
source
From the sounds of it you understand what MVC is and are just confused as to how to implement it in JS, just look at the many different frameworks out there (ember.js, backbone.js, etc) and their source to get their take on it. The todo list is a great starting point.
The first truth is that View and Controller are - in most cases - very close. Sometimes even the same. And that isn't neccessarily bad. If you have a table, select a row, then click on a button that will change the data in the selected row, the button will obviously part of the View (you see data) and the Controller (you change data). There are better examples for this, I'm sure...
The second truth is that you will find almost as many opinions on MVC as there are people ;)
But personally, I'd advise you not to follow some design pattern slavishly. MVC is good starting point to design your code, but in the end, your code needs to be fast, stable and maintainable. And, you (and your team) have to be comfortable with the code. If you end up with code that follows the MVC pattern, fine. If not, also fine. At least that's my view on that.