StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>As i know there are no specific patterns for Javascript yet. But I think there is a potential for something like widgets(component) approach. Since mainly we use javascript to empower our html code. It is logically that we should connect our every javascript object to html tag. So here we have something like Model(jsObject)+View(HTMLrepresentation). To get MVC we need controllers and we have Events for this. In this case we will have incapsulated easily extensibel component.</p> <p>for example:</p> <pre><code>// this is a part of some FormValid.js <script> function FormValid(){ } FormValid.prototype.validate=function(){...} </script> //this is our HTML <form id="form1"...onsubmit="this.jsObject.validate();"> </form> <script> //all the following stuff could be solved in one line, but you need to create some helper. Like Components.Attach("FormValid").to("form1"); var newObj=new FormValid() var form=document.getElementById("form1"); from.jsObject=newObj; newObj.htmlObj=form; </script> </code></pre> <p>Also I have an idea of using template engines like <a href="http://code.riiv.net/zparse/" rel="nofollow noreferrer">Zparser</a> to separate view and model. I am developing js library for this, so I am in this question right now.</p> <p>We have core object with <strong>view</strong> method. All our classes have it like a prototype at he end. This method gets <strong>templates</strong> property of class and using some templates parser generates HTML basing on our model. This HTML is inserted in htmlObj node so the VIEW of our object is updated. This is basically an idea and our code becomes:</p> <pre><code>// this is a part of some FormValid.js <script> function FormValid(){ } Components.extendCore(FormValid); FormValid.prototype.validate=function(){...} </script> FormValid.prototype.templates={ main:'<form class="form1"...onsubmit="this.jsObject.validate();">...</form>' } //this is our HTML <div id="form1"></div> <script> Components.Attach("FormValid").to("form1"); </script> </code></pre> <p>I still think last one inline <code><script></code> should be there and it is not mixing logic with representation because this is component - solid piece. It have no meaning one without another. Actually this should be a part of application. Something like html of component(in las one example is div) should be defined and wrapped with component which will automatically add script and ids.</p> <p>Now. I showed you 2 examples and i will explain why second is too specific.<br> All stuff is in accessibility and performance(and memory leaks). If you will refresh all html of component frequently - it will blink, also you will need to set up all dynamic events back and check everything for memory leaks. But the main problem if JS will fail - your application will show nothing.</p> <p>So i prefer to have choice between those two:) and use everything on their places. </p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload