StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>See any of the <a href="http://developer.yahoo.com/yui/2/" rel="nofollow noreferrer">YUI widgets</a>. Eg multiple YUI-enhanced <a href="http://developer.yahoo.com/yui/examples/button/btn_example01.html" rel="nofollow noreferrer">buttons</a> on a page.</p> <p><strong>Creating multiple instances with per-instance data</strong></p> <p>The basic technique is shown below.</p> <p>Since the calling program uses new, a new instance of the Larry.widget object is created for each widget. So each widget has its own, separate object "this" and uses it for storing per-instance data.</p> <p>At the same time, the object's prototype holds the functions. So all of the widgets share the same functions, but have their set of data.</p> <pre><code>Larry = {}; // Create global var Larry.widget = function (options) { // create with new. Eg foo = new Larry.widget({an_option: true, id: "q_el"}); // options: object with members: // an_option // id // Then call foo.xyz(); to get the widget to do xyz this.init(options); }; Larry.widget.prototype = { constructor: Larry.widget, // Setting the constructor explicitly since we're setting the entire // prototype object. // See http://stackoverflow.com/questions/541204/prototype-and-constructor-object-properties/541268#541268 init: function(options) { this.id = options.id; this.an_option= options.an_option; this._function_a(); // finish initialization via a function. }, // remember that function init is a member of the object, so separate // the functions using commas _function_a: function() { // This is a "private" function since it starts with _ // Has access to "this" and its members (functions and vars) .... }, xyz: function() { // This is a "public" function. // Has access to "this" and its members (functions and vars) ... } // Note: NO TRAILING COMMA! // IE will choke if you include the trailing comma. } </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