<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>expatiari expatria &#187; template</title>
	<atom:link href="http://genaud.net/tag/template/feed/" rel="self" type="application/rss+xml" />
	<link>http://genaud.net</link>
	<description>genaud.net</description>
	<lastBuildDate>Wed, 16 Nov 2011 05:51:15 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0.4</generator>
		<item>
		<title>Javascript Visibility</title>
		<link>http://genaud.net/2009/05/javascript-visibility/</link>
		<comments>http://genaud.net/2009/05/javascript-visibility/#comments</comments>
		<pubDate>Fri, 22 May 2009 18:00:26 +0000</pubDate>
		<dc:creator>Alex</dc:creator>
				<category><![CDATA[geek]]></category>
		<category><![CDATA[class]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[OOP]]></category>
		<category><![CDATA[private]]></category>
		<category><![CDATA[public]]></category>
		<category><![CDATA[scope]]></category>
		<category><![CDATA[template]]></category>

		<guid isPermaLink="false">http://genaud.net/?p=263</guid>
		<description><![CDATA[I often find myself reinventing the wheel and get lost around closures, prototypes, unscoped variables, and other OOP-like features of Javascript. So I created a Javascript &#8216;class cheat-sheet&#8216; with the several ways of instantiating and referencing objects therein. I&#8217;ve eliminated redundant styles and what I found useless (unscoped globals). Without further ado: function Class() { [...]]]></description>
			<content:encoded><![CDATA[<p>I often find myself reinventing the wheel and get lost around closures, prototypes, unscoped variables, and other OOP-like features of Javascript. So I created a Javascript &#8216;<a href="http://git.genaud.net/jsClass/">class cheat-sheet</a>&#8216; with the several ways of instantiating and referencing objects therein. I&#8217;ve eliminated redundant styles and what I found useless (unscoped globals). Without further ado:</p>
<pre>
function Class() {
  //
  // PUBLIC INSTANCE
  // instance public variable and methods
  //
  <b>this.instance_public</b> = 2;

  <b>this.instance_public_func = function()</b> {
    return private_var +
      <b>this</b>.instance_public +
      <b>this</b>.prototype_public;
  }

  //
  // PRIVATE
  // private variable and methods
  //
  var  that = this;
  <b>var  private_var</b> = 1;

  <b>function private_func()</b> {
    return private_var +
      <b>that</b>.instance_public +
      <b>that</b>.prototype_public;
  }

}
//
// PROTOTYPE PUBLIC
// prototype public variable and methods
//
<b>Class.prototype.prototype_public</b> = 4;

<b>Class.prototype.prototype_public_func = function()</b> {
    <b>// private_var (hidden from prototype)</b>
    return <b>this</b>.instance_public +
      <b>this</b>.prototype_public;
}
</pre>
<p>What does it mean? Well, I am aware of three ways to declare a field (basic variable) within a constructor (class definition) and one in the prototype. These are:</p>
<pre>
function Class() {
  var private;
  this.public1;
  global;
}
Class.prototype.public2;
</pre>
<p>The <code>var</code> scopes a object within its surrounding <code>{ }</code> block. Such objects are accessible (through closure) to any function within the same block, but invisible outside of the block.</p>
<p>In the example above, <code>public1</code> and <code>public2</code> have the same visibility. However, the latter is memory efficient. <code>public2</code> acts somewhat like a static class variable except that it can be overridden by any instance. Explicitly referencing <code>prototype.public2</code> is akin to a static member in other languages such as Java. The <code>.</code> (dot) before the variable name that binds it to an object and makes it public, whether that object is <code>this</code>, <code>that</code> or <code>var hash = {}; hash.key = "value";</code>.</p>
<p>Any unbound object (via dot (.) or <code>var</code>) is global. There are very few (perhaps no) good reasons to do this.</p>
<h2>Caveats</h2>
<p>Note that <code>function x</code> is shorthand for <code>var x = function</code>. The following two methods are equivalent.</p>
<pre>
  function private_method1() {
    return that;
  };

  var private_method2 = function() {
    return that;
  };
</pre>
<p>Private and global functions defined within a constructor do not have access to the implied new object reference <code>this</code>, but can access another reference such as <code>var that = this;</code>. Perhaps this is a &#8216;bug&#8217; in the ECMA standard.</p>
<p>Private (<code>var</code>) and instance public (<code>this.</code>) members, may access all other members of a class, including prototype variables and functions. However, prototype members may not access private members defined within the constructor. The following will fail:</p>
<pre>
   function X() { var priv = 6; };
   X.prototype.proto = function() { return priv; };
   var x = new X();
   alert(x.proto());
</pre>
<p>Private and prototype functions may be called within the constructor before they have been defined. But instance public are only available (at runtime) after they&#8217;ve been instantiated. For example, &#8220;<code>priv and proto</code>&#8221; will be alerted, but an error will be thrown on line 3 because <code>this.pub</code> has not yet been defined.</p>
<pre>
 1    function X() {
 2      alert(priv() +" and "+ this.proto());
 3      alert(this.pub());
 4      function priv() { return "priv"; }
 5      this.pub = function() { return "pub"; }
 6    }
 7    X.prototype.proto = function() { return "proto"; };
 8    new X();
</pre>
<h2>Variations</h2>
<p>A singleton object has only one instance and there are thus no advantages of the prototype.</p>
<pre>
var s = new function S() {
  this.pub_var = 1;
  this.pub = function() {};
  var that = this;
  function priv() {};
}();
</pre>
<p>Slightly more exotic, is a singleton whose members are all public:</p>
<pre>
var h = {
  field : "public",
  method : function() { return this.field; }
};
</pre>
<p>Returning the singleton from a constructor, gives us access to private variables. Consider the &#8220;Module Pattern&#8221;:</p>
<pre>
var Namespace = {
  C : function() {
    var priv = "priv";
    return {
      field : "pub",
      method : function() { return priv +" and "+ this.field; }
    }
  }
};
var c = new Namespace.C();
</pre>
]]></content:encoded>
			<wfw:commentRss>http://genaud.net/2009/05/javascript-visibility/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

