StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POHow to write Classes in Javascript and Code management?
text
Body
copied!<p>If I am not wrong then there is no such thing as <code>'Class'</code> in javascript instead everything is object.</p> <p>But I happen to find a code/script which actually has a class. </p> <p>I want to know how (Code example given below)</p> <p>1) Is this type of code writing helpful in managing the code and function? (Yeah, I think everything is within global Sidebar object so its good, namespaced, no conflict. Your opinion?)</p> <p>2) How do you call any function written within this type of class?</p> <p>3) Is there actually any performance improvement with such style? Can someone post a better working example? Script has been taken from <a href="http://jsfiddle.net/js/Sidebar.js" rel="nofollow">http://jsfiddle.net/js/Sidebar.js</a></p> <p>// Notice reportAbuse function .... How to call functions within function? Are they publicly accessible</p> <pre><code>var Sidebar = new Class({ Implements: [Options, Events], parameter: "Sidebar", options: { DOM: '', toggleSidebar: 'toggleSidebar' }, initialize: function(options) { this.setOptions(options); // Some more code }, toElement: function() { return this.element; }, hide: function() { this.element.hide(); this.contentMargin = $('content').getStyle('marginLeft'); $('content').setStyle('marginLeft', 13); this.hidden = true; Layout.resize(); }, show: function() { $('content').setStyle('marginLeft', this.contentMargin); this.element.show(); this.hidden = false; Layout.resize(); }, reportAbuse: { setup: function() { this.element = { textarea: document.id('abuse-text'), submit: document.id('send-abuse') }; if (this.element.textarea && this.element.submit) { this.element.submit.addEvents({ click: this.validate.bind(this) }); } }, validate: function(event) { event.stop(); if (this.element.textarea.get('value').trim() !== '') { this.send(); } else { this.element.textarea.highlight(); } } // Few more functions within reportAbuse function } }); </code></pre>

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