Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
The TreeLogic JavaScript Coding Standard: A Practical Approach
<!DOCTYPE html>
<title>JavaScript Coding Standard</title>
<style type="text/css">
@import url('');ol{margin:0;padding:0}.c1{color:#35382a;font-size:16pt;background-color:#ffffff;font-weight:bold}.c0{font-size:10pt;background-color:#ffffff;font-family:"Verdana"}.c16{list-style-type:circle;margin:0;padding:0}.c29{list-style-type:decimal;margin:0;padding:0}.c15{list-style-type:disc;margin:0;padding:0}.c27{font-size:24pt;font-style:italic;font-family:"Yanone Kaffeesatz"}.c3{color:#35382a;font-size:12pt;background-color:#ffffff}.c19{padding-left:0pt;margin-right:11pt;margin-left:33pt}.c24{font-size:30pt;font-family:"Yanone Kaffeesatz"}.c8{color:#1155cc;text-decoration:underline}.c9{color:#35382a;font-size:22pt}.c11{color:inherit;text-decoration:inherit}.c7{padding-left:0pt;margin-left:36pt}.c18{max-width:468pt;padding:72pt 72pt 72pt 72pt}.c20{font-size:10pt}.c25{margin-left:18pt}.c13{margin-left:54pt}.c10{height:11pt}.c26{text-align:justify}.c17{color:#35382a}.c23{margin-left:36pt}.c2{font-family:"Verdana"}.c12{font-family:"Courier New"}.c4{direction:ltr}.c28{margin-left:90pt}.c21{padding-left:0pt}.c14{text-align:center}.c6{background-color:#ffffff}.c22{font-size:12pt}.c5{margin-left:72pt}.title{padding-top:24pt;line-height:1.15;text-align:left;color:#000000;font-size:36pt;font-family:"Arial";font-weight:bold;padding-bottom:6pt}.subtitle{padding-top:18pt;line-height:1.15;text-align:left;color:#666666;font-style:italic;font-size:24pt;font-family:"Georgia";padding-bottom:4pt}li{color:#000000;font-size:11pt;font-family:"Arial"}p{color:#000000;font-size:11pt;margin:0;font-family:"Arial"}h1{padding-top:24pt;line-height:1.15;text-align:left;color:#000000;font-size:18pt;font-family:"Arial";font-weight:bold;padding-bottom:6pt}h2{padding-top:18pt;line-height:1.15;text-align:left;color:#000000;font-size:14pt;font-family:"Arial";font-weight:bold;padding-bottom:4pt}h3{padding-top:14pt;line-height:1.15;text-align:left;color:#666666;font-size:12pt;font-family:"Arial";font-weight:bold;padding-bottom:4pt}h4{padding-top:12pt;line-height:1.15;text-align:left;color:#666666;font-style:italic;font-size:11pt;font-family:"Arial";padding-bottom:2pt}h5{padding-top:11pt;line-height:1.15;text-align:left;color:#666666;font-size:10pt;font-family:"Arial";font-weight:bold;padding-bottom:2pt}h6{padding-top:10pt;line-height:1.15;text-align:left;color:#666666;font-style:italic;font-size:10pt;font-family:"Arial";padding-bottom:2pt}
<body class="c6 c18">
<h1 class="c4 c14"><a name="h.dtr57fc6nczs" id=
"h.dtr57fc6nczs"></a><span class="c24">The TreeLogic JavaScript Coding Standard</span></h1>
<h1 class="c4 c14"><a name="h.3lukcd6ec7jk" id=
"h.3lukcd6ec7jk"></a><span class="c27">A Practical
<p class="c10 c4"></p>
<p class="c4 c26"><span>by Chris M. Balz
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; 2012-10-21</span></p>
<p class="c10 c4"></p>
<p class="c4"><span>Forkable at:</span> <span class="c8"><a class=
"c11" href=
<p class="c10 c4"></p>
<p class="c4"><span class="c2 c6 c17">Copyright (C) &nbsp;Chris M.
&nbsp; &nbsp;Permission is granted to copy, distribute and/or
modify this document<br>
&nbsp; &nbsp;under the terms of the GNU Free Documentation License,
Version 1.3<br>
&nbsp; &nbsp;or any later version published by the Free Software
&nbsp; &nbsp;with no Invariant Sections, no Front-Cover Texts, and
no Back-Cover Texts.<br>
&nbsp; &nbsp;A copy of the license is included in the section
entitled "GNU<br>
&nbsp; &nbsp;Free Documentation License".</span></p>
<p class="c10 c4"></p>
<h2 class="c4"><a name="h.5jl7gi75seft" id=
"h.5jl7gi75seft"></a><span>Table of Contents</span></h2>
<p class="c10 c4"></p>
<p class="c25 c4"><span class="c8"><a class="c11" href=
"#h.dtr57fc6nczs">The TreeLogic JavaScript Coding
<p class="c4 c25"><span class="c8"><a class="c11" href=
"#h.3lukcd6ec7jk">A Practical Approach</a></span></p>
<p class="c4 c23"><span class="c8"><a class="c11" href=
"#h.5jl7gi75seft">Table of Contents</a></span></p>
<p class="c13 c4"><span class="c8"><a class="c11" href=
<p class="c4 c5"><span class="c8"><a class="c11" href=
<p class="c4 c5"><span class="c8"><a class="c11" href=
<p class="c13 c4"><span class="c8"><a class="c11" href=
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.b78aclyrbegz">What and Where to Use</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.5p9g3ixznax">Object Instantiation: Classes and
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.yb1w5espc2b">Constructor Format</a></span></p>
<p class="c4 c28"><span class="c8"><a class="c11" href=
"#h.d4lmqaw7ag7v">Private Variables</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.k6t0gv314na">Class Properties</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.glmw5f4stbg4">Avoid Parasitic Inheritance</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.axiwb5e2var2">Where to Define Classes</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.ddrj4m9kl74d">&ldquo;Why&rdquo;s Not Covered
<p class="c4 c13"><span class="c8"><a class="c11" href=
<p class="c13 c4"><span class="c8"><a class="c11" href=
<p class="c4 c5"><span class="c8"><a class="c11" href=
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.mcg2c9md73a0">Private Functions</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.gp0wmyazdmrv">Protected Functions</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.7fjye37pq4q6">As Data</a></span></p>
<p class="c13 c4"><span class="c8"><a class="c11" href=
"#h.j2qbgrpk6np4">&lsquo;var&rsquo; Declarations</a></span></p>
<p class="c13 c4"><span class="c8"><a class="c11" href=
"#h.v0awkmkowrx1">Loop Counter Caching</a></span></p>
<p class="c13 c4"><span class="c8"><a class="c11" href=
<p class="c4 c5"><span class="c8"><a class="c11" href=
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.qzyye2slamkq">Private and Protected Properties</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.2bb8e58hujqv">&lsquo;match&rsquo; vs.
<p class="c4 c5"><span class="c8"><a class="c11" href=
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.2jyz28hmjwg7">Data Type Prefixing</a></span></p>
<p class="c13 c4"><span class="c8"><a class="c11" href=
"#h.ple5ypf5m9e5">Built-In Objects</a></span></p>
<p class="c13 c4"><span class="c8"><a class="c11" href=
<p class="c4 c5"><span class="c8"><a class="c11" href=
<p class="c4 c5"><span class="c8"><a class="c11" href=
<p class="c13 c4"><span class="c8"><a class="c11" href=
"#h.ta1e3atvn4ac">Messaging Data Formats</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.dir2kok2h9gh">Which Messaging Data Format to Use</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.kdsc56tlnfrr">Commenting JSON</a></span></p>
<p class="c13 c4"><span class="c8"><a class="c11" href=
"#h.doey2srr2tvv">Code Format</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
<p class="c4 c5"><span class="c8"><a class="c11" href=
<p class="c4 c5"><span class="c8"><a class="c11" href=
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.fql68ac253cb">Curly Braces</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.65bieoxmoylx">Line Length</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.8cdivrfr57be">Line Breaks</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.y0slwg6wa2m0">Statement Terminators</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.kyykh3cgp1v3">Conditional Parentheses</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.4vindrg87vh0">Object Initializer Syntax</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.cesukrsq658g">Testing for Equality</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
<p class="c13 c4"><span class="c8"><a class="c11" href=
<p class="c4 c5"><span class="c8"><a class="c11" href=
<p class="c13 c4"><span class="c8"><a class="c11" href=
"#h.66i0v5gidbnw">Various Measures</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
<p class="c4 c5"><span class="c8"><a class="c11" href=
<p class="c4 c5"><span class="c8"><a class="c11" href=
<p class="c13 c4"><span class="c8"><a class="c11" href=
"#h.7mk617fpkpcb">External Environments</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.tdcjhyy551yk">Document Object Model</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
<p class="c13 c4"><span class="c8"><a class="c11" href=
"#h.sgxlj3zh0gqn">GNU Free Documentation License</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.e93ad1j6byjw">0. PREAMBLE</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.ps02bkv1r9r3">1. APPLICABILITY AND DEFINITIONS</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.l5t6umkmjz4q">2. VERBATIM COPYING</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.18mhs1nje4vt">3. COPYING IN QUANTITY</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.llaqq9qc46ts">4. MODIFICATIONS</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.k53hm87wq5ad">5. COMBINING DOCUMENTS</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.5hw1y38mvgm0">6. COLLECTIONS OF DOCUMENTS</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.ghx68256x0cw">8. TRANSLATION</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.wx8aftj0yhb7">9. TERMINATION</a></span></p>
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.l15xp4veaojo">10. FUTURE REVISIONS OF THIS
<p class="c4 c5"><span class="c8"><a class="c11" href=
"#h.txe1ejocoaau">11. RELICENSING</a></span></p>
<p class="c10 c4"></p>
<h3 class="c4"><a name="h.w17nl9ecyonr" id=
<h4 class="c4"><a name="h.hs6trgg9arnz" id=
<p class="c4"><span class="c2 c6">Namespace all identifiers from
the global namespace with at least one three-character identifier,
and prefer more characters. &nbsp;This forms your JavaScript
package namespace. &nbsp;All characters must be lowercase, using
the underbar where words meet. &nbsp;</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2 c6">For example,</span><span class=
"c0">&nbsp;</span><span class=
"c20 c12 c6"></span><span class=
"c0">&nbsp;</span><span class="c2 c6">would represent a for-profit
business with the abbreviation &lsquo;tl&rsquo; for the company
name (although that could be the domain name too), and the project
&lsquo;flfy&rsquo; (say, for the &ldquo;Fluffy&rdquo; project at
the company designated by &ldquo;tl&rdquo;). &nbsp;Then underneath
&lsquo;flfy&rsquo;, provide appropriate package namespacing, such
as those found in a model-view-controller
architecture</span><span class="c0">:</span> <span class=
"c12 c6 c20"></span><span class="c2 c6">.
<p class="c10 c4"></p>
<p class="c4"><span class="c2 c6">Create a single directory for
each package. &nbsp;This allows directory browsing itself to reveal
the system&rsquo;s overall code structure.</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2 c6">Allow similarly-namespaced code
to co-exist (such as code namespaced at the top-level with
&lsquo;com&rsquo;) easily by never overwriting the top-level
namespace (except of course with your sub-namespace). &nbsp;If
possible, observe that practice for the top two or three namespace
levels. &nbsp;These then become shared namespaces. &nbsp;Never rely
on properties (dot-properties) of shared namespaces, since other
code may well be using them. Never use dot-properties other than
other namespaces or module names on either one. &nbsp;</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2 c6">Why: Namespace clashes are one of
the worst, most avoidable hassles imaginable. &nbsp;JavaScript code
from different namespaces now commonly lives together on the same
page, and this will become more common. &nbsp;A descriptive
namespace helps reduce the biggest drag on productivity, time spent
reading and understanding code. &nbsp;Keeping namespaces free of
dot-properties allows all properties to be grouped under meaningful
data types.</span></p>
<h4 class="c4"><a name="h.d5t9y2p03wzz" id=
<p class="c4"><span class="c2 c6">Name a JavaScript module this
way:</span><span class="c0">&nbsp;</span><span class=
"c20 c12 c6"></span><span class="c2 c6">.
&nbsp;If sub-modules are provided, namespace them in this
manner:</span> <span class=
"c20 c12 c6"></span><span class="c2 c6">.
JavaScript modules must be completely contained in a function named
with the fully-qualified package name with all dot characters
replaced by underbars.</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2 c6">Why: Modules are fundamentally
different kinds of objects than packages because they define a set
of private variables sealed in a function closure. &nbsp;But we
want to be able to define a group of sub-modules, each in their own
file. &nbsp;So we can use modules as namespaces as well.
<p class="c10 c4"></p>
<p class="c4"><span class="c2 c6">Therefore, since we mix the two
types of identifiers in the same namespace qualifier, we add the
suffix &lsquo;_module&rsquo; to distinguish between the two.
&nbsp;We avoid anonymous functions in order to have a
function&rsquo;s name be present for clarity when reading code and
especially when reading code during the debugging process.
<p class="c4 c10"></p>
<h3 class="c4"><a name="h.yk2d3omnmdl5" id=
<h4 class="c4"><a name="h.b78aclyrbegz" id=
"h.b78aclyrbegz"></a><span>What and Where to Use</span></h4>
<p class="c4"><span class="c2 c6">The term class here means
&ldquo;custom data type&rdquo;. &nbsp;Although JavaScript natively
only supports prototypes, not classes, JavaScript can easily
deliver class constructors. &nbsp;Most systems should use instances
of classes as their primary means of organizing their code.
&nbsp;By contrast to classes, prototypes present a unity of
instance and data type. &nbsp;</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2 c6">This does not serve</span>
<span class="c8 c2 c6"><a class="c11" href=
programming-in-the-large</a></span><span class="c2 c6">&nbsp;well
because objects that are inherited from may be inadvertently
changed, polluting inheriting objects that intended to be what the
prototype object used to be before it was changed. &nbsp;Even if
your project does not start out as programming-in-the-large, if it
is successful it is likely to become so. &nbsp;In this case, if you
did not use techniques appropriate to programming-in-the-large,
then you have a misfortune.</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2 c6">In fact, prototype inheritance
was conceived of as an experiment in simplification by the creators
of the ancestor language of JavaScript, Self. &nbsp;And it served
JavaScript&rsquo;s original role in serving as a quick</span>
<span class="c8 c2 c6"><a class="c11" href=
programming-in-the-small</a></span><span class="c2 c6">&nbsp;aid to
adorners of early websites. &nbsp;But the authors of
&ldquo;</span><span class="c8 c2 c6"><a class="c11" href=
"">Self: The
Power of Simplicity</a></span><span class="c2 c6">&rdquo; observed
in 1994 that &ldquo;The absence of the class-instance distinction
may make it too hard to understand which objects exist solely to
provide shared information for</span></p>
<p class="c4"><span class="c2 c6">other objects.&rdquo; (p.
<p class="c10 c4"></p>
<p class="c4"><span class="c2 c6">So most systems should be
object-based, and classes will usually serve this best. &nbsp;It is
possible to work more strictly within object-based approaches:
Object-oriented systems, by comparison, use only object-based
design approaches. &nbsp;To refine further: Almost all systems
where computational load is low in terms of performance cost as
compared to file i/o should be object-based, if not
<h4 class="c4"><a name="h.5p9g3ixznax" id=
"h.5p9g3ixznax"></a><span>Object Instantiation: Classes and
<p class="c4"><span class="c2 c6">For imperative code (where, for
example, we are not providing an input to a declarative mechanism
such as a template transform, or passing a message as part of a
true network protocol over the wire, such as json), mutable values
(meaning, non-immutables: JavaScript objects; not strings,
booleans, numbers, functions, or undefineds) must be created
<ol class="c15" start="1">
<li class="c7 c4"><span class="c2 c6">With a formal class
constructor using the &lsquo;new&rsquo; operator</span></li>
<li class="c7 c4"><span class="c2 c6">As parameterized hashes
(meaning, with member variables all of the same data
<li class="c7 c4"><span class="c2 c6">As static classes (defined
most conveniently by using object initializer syntax (for
example,</span> <span class="c12 c6"> = { . . .
};</span><span class="c2 c6">&nbsp;)).</span></li>
<p class="c10 c4"></p>
<p class="c4"><span class="c2 c6">Do not hide &lsquo;new&rsquo;:
The &lsquo;new&rsquo; operator should not be buried as a
convenience inside class constructors that can construct
themselves, since this obfuscates the action taking place at the
application level: It makes instantiations look like method calls
or at best some kind of weird invocation of a static
<p class="c10 c4"></p>
<h4 class="c4"><a name="h.yb1w5espc2b" id=
"h.yb1w5espc2b"></a><span>Constructor Format</span></h4>
<p class="c4"><span class="c2 c6">Class constructors must always be
named with a capital letter.</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2 c6">When creating a class that may be
inherited by another class, use a utility (such as a class engine)
from a JavaScript framework that will enable you to follow a
pattern that avoids unwanted shared objects among instances of the
inheriting class.</span></p>
<h5 class="c4"><a name="h.d4lmqaw7ag7v" id=
"h.d4lmqaw7ag7v"></a><span>Private Variables</span></h5>
<p class="c4"><span class="c2 c6">Where useful, support private
instance variables, which unfortunately only works out-of-the-box
in JavaScript for immutable data types, by using the closure
created by the class constructor to define &lsquo;this&rsquo;
methods that return &lsquo;var&rsquo; variables. &nbsp;For mutables
(objects), use object cloning to produce a brand new object for
each &lsquo;get&rsquo; request for that object, if it is fast
enough for your application. In essence, this provides a read-only
object for clients.</span></p>
<h4 class="c4"><a name="h.h584hdlb4ufv" id=
<p class="c4"><span class="c2 c6">When creating a singleton, prefer
a utility (such as a class engine) from a JavaScript framework that
will inherently enforce the singleton from a declarative
<h4 class="c4"><a name="h.k6t0gv314na" id=
"h.k6t0gv314na"></a><span>Class Properties</span></h4>
<p class="c4"><span class="c2 c6">All classes should have the
instance property</span> <span class=
"c12 c6">$DATA_TYPE</span><span class="c2 c6">&nbsp;with a value
set to the fully-qualified name of the class, so that the reader
can quickly see what they are working with, esp. when debugging.
&nbsp;The &lsquo;$&rsquo; indicates meta information and also
floats to the top of most property lists.</span></p>
<h4 class="c4"><a name="h.glmw5f4stbg4" id=
"h.glmw5f4stbg4"></a><span>Avoid Parasitic Inheritance</span></h4>
<p class="c4"><span class="c2 c6">Keep data types true to their
definition by avoiding parasitic inheritance. &nbsp;Instead of
parasitic inheritance, use composition (&ldquo;has-a&rdquo;), since
it preserves the identity of the object contexts used.</span></p>
<h4 class="c4"><a name="h.axiwb5e2var2" id=
"h.axiwb5e2var2"></a><span>Where to Define Classes</span></h4>
<p class="c4"><span class="c2 c6">Define all classes (static and
nonstatic) in modules, with only one outer class per module.
&nbsp;This enables directory listings themselves to describe the
code structure.</span></p>
<h4 class="c4"><a name="h.ddrj4m9kl74d" id=
"h.ddrj4m9kl74d"></a><span>&ldquo;</span><span>Why&rdquo;s Not
Covered Above</span></h4>
<p class="c4"><span class="c2 c6">For imperative code, making
instances from class constructors instead of using
non-parameterized hashes (especially as parameters to other
JavaScript functions increases code readability) localizes error
checking, improves testability, and makes all of the above more
portable. &nbsp;Avoiding non-parameterized hashes in imperative
code keeps the distinction between class, instance, and data clear.
&nbsp;Using the &lsquo;new&rsquo; operator emphasizes the
allocation of memory for an instance of a new data type.
&nbsp;Naming classes with a capital letter serves to differentiate
them from other identifiers. &nbsp;Avoiding parasitic inheritance
avoids confusing dynamic changes in data types and allows humans to
understand classes better when they read them and then try to
recall them during debugging.</span></p>
<p class="c10 c4"></p>
<h3 class="c4"><a name="h.gimcu66sjttv" id=
<p class="c4"><span class="c2">Modules should be constructed
according the following pattern:</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class=
"c12"> =</span></p>
<p class="c4"><span class="c12">(function
com_tl_flfy.ctrlr.proxy_server_module() {</span></p>
<p class="c4"><span class="c12">&nbsp; &nbsp;'use
<p class="c10 c4"></p>
<p class="c4"><span class="c12">&nbsp; &nbsp;var fs =
<p class="c4"><span class="c12">&nbsp; &nbsp; &nbsp; &nbsp;url =
<p class="c10 c4"></p>
<p class="c4"><span class="c12">&nbsp; &nbsp;// Constructor
<p class="c10 c4"></p>
<p class="c4"><span class="c12">&nbsp; &nbsp;// Public functions
<p class="c10 c4"></p>
<p class="c4"><span class="c12">&nbsp; &nbsp;// Private functions
<p class="c10 c4"></p>
<p class="c4"><span class="c12">&nbsp; &nbsp;. . .</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c12">})();</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2">Define only one outermost module per
file. &nbsp;This enables directory browsing itself to reveal code
structure. &nbsp;</span><span class="c2 c6">Define only a single,
if any, public class per module. &nbsp;Keep module length to less
than 400 lines.</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2">Why:</span> <span class=
strict&rsquo;</span><span>&nbsp;</span><span class="c2">saves us
from some of the most pernicious JavaScript pitfalls, without
reducing expressiveness or power by much in comparison. &nbsp;See
above about namespacing. &nbsp;See below about the other aspects.
&nbsp;Defining only one module per file enables the developer to
use the directory browsing facility of their operating system to
quickly understand the high-level structure of your code.
&nbsp;</span><span class="c2 c6">Consensus of experience generally
shows that readability and understandability begins to greatly
decrease when modules exceed about 300 lines of code.</span></p>
<p class="c10 c4"></p>
<h3 class="c4"><a name="h.yzrl8vz6dgwk" id=
<h4 class="c4"><a name="h.bmnesea0xe6l" id=
<p class="c4"><span class="c2">All parameters should have a 'p_'
prefix: &lsquo;p_sName&rsquo;.</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2">Offer the highest-level functions at
the top, working down. &nbsp;This enables human readers to get the
context of your code, before optionally diving into the
<p class="c10 c4"></p>
<p class="c4"><span class="c2">Always return the same data type
from any part of a function that returns a value.</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2">Keep function length (excepting the
outermost module wrapper function) to less than 60 lines, for
readability and modularity.</span></p>
<h4 class="c4"><a name="h.mcg2c9md73a0" id=
"h.mcg2c9md73a0"></a><span>Private Functions</span></h4>
<p class="c4"><span class="c2">Leverage private (inner) functions
for increased readability and modularity. &nbsp;It makes rewriting
functions much easier. &nbsp;See the</span> <span class=
"c8 c2"><a class="c11" href="#h.ra2sw5ezzkym">section on invoking
functions</a></span><span class="c2">&nbsp;for how to invoke these
<h4 class="c4"><a name="h.gp0wmyazdmrv" id=
"h.gp0wmyazdmrv"></a><span>Protected Functions</span></h4>
<p class="c4"><span class="c2">Offer protected (in the Java sense
of package-protected) functions by prefixing their identifiers with
an underbar character: &lsquo;this._my_protected&rsquo;.</span></p>
<h4 class="c4"><a name="h.ra2sw5ezzkym" id=
<p class="c4"><span class="c2">Code that invokes a function should
either use a &lsquo;new&rsquo; operator, a &lsquo;this&rsquo;
prefix, or where there is no local &lsquo;var&rsquo; such as
&lsquo;that&rsquo; representing &lsquo;this&rsquo;, a
&lsquo;.call&rsquo; or &lsquo;.apply&rsquo; invocation with the
&lsquo;this&rsquo; identifier. &nbsp;</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2">Where a private function is called
from an instance context, &lsquo;.call&rsquo; or
&lsquo;.apply&rsquo; should be used with the &lsquo;this&rsquo;
identifier if that function is over twenty lines in length.
&nbsp;This helps to improve code readability. &nbsp;Always prefer
&lsquo;call&rsquo; over &lsquo;apply&rsquo; where possible, as it
requires the listing of the parameters individually, providing a
greater opportunity for naming.</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2">Why: The &lsquo;new&rsquo; operator
emphasizes the fact that we are allocating a significant amount of
memory in the operation. &nbsp;Controlling function
&lsquo;this&rsquo; scope keeps one from being stuck wondering what
instance the current closure belongs to when debugging minified,
concatenated production code. &nbsp;Tools such as source-maps can
avoid this, but in practicality are not always
<h4 class="c4"><a name="h.7fjye37pq4q6" id=
"h.7fjye37pq4q6"></a><span>As Data</span></h4>
<p class="c4"><span class="c2">Avoid callbacks across class and
class instance boundaries where possible, in favor of a true event
system. &nbsp;Callbacks carry with them their lexical scope, which
if transported across significant, different formations of code,
can make code not only hard to read but practically untestable, as
encapsulation is broken by the transferred scope. &nbsp;</span></p>
<h3 class="c4"><a name="h.j2qbgrpk6np4" id=
<ol class="c29" start="1">
<li class="c7 c4"><span class="c2">Define only a single
&lsquo;var&rsquo; statement per function, and keep it at the very
top of the function. &nbsp;This way, the reader can easily see what
variables your function works with. &nbsp;If the list becomes hard
to read, it is a sign you need to break out some of your existing
code a new (or, occasionally, just a different)
<li class="c7 c4"><span class="c2">Avoid excess code by using the
comma operator to make a &lsquo;var&rsquo; list, rather than
repeating &lsquo;var&rsquo;. &nbsp;&lsquo;use strict&rsquo; mode
will make sure you don&rsquo;t accidentally declare a global
variable by missing a comma: It will throw a hard error that
you&rsquo;ll see.</span></li>
<li class="c7 c4"><span class="c2">Define each assignment on its
own line, and unassigned variables at the bottom of the
&lsquo;var&rsquo; statement on a single line.</span></li>
<li class="c7 c4"><span class="c2">Within each section (assigned
variables, and unassigned ones), offer the highest-level variables
first. &nbsp;This enables human readers to get the context of your
code, before optionally diving into the details. &nbsp;</span></li>
<p class="c10 c4"></p>
<h3 class="c4"><a name="h.v0awkmkowrx1" id=
"h.v0awkmkowrx1"></a><span>Loop Counter Caching</span></h3>
<p class="c4"><span class="c2">Due to the apparent fact that
JavaScript engines translate &lsquo;for&rsquo; loops to iterators
(traversed by &lsquo;next&rsquo;), there is no benefit to caching
the length limit of your loops:</span> <span class=
"c8 c2"><a class="c11" href=
""></a></span><span class="c2">&nbsp;
And there is the disadvantage that if your JavaScript
&lsquo;Array&rsquo; instance length changes while the loop is
running, you will either hit an undefined value or not reach the
end of your &lsquo;Array&rsquo;.</span></p>
<p class="c10 c4"></p>
<h3 class="c4"><a name="h.rzsgject3edh" id=
<h4 class="c4"><a name="h.42e0t8kshs0k" id=
<p class="c4"><span class="c2">Before naming something, put
yourself in the shoes of someone new to the code who must fix a
critical bug quickly. &nbsp;</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2">Adhere to terseness, but always err
on the side of verbosity when balancing verbosity and
<p class="c10 c4"></p>
<p class="c4"><span class="c2">For non-package, non-module
identifiers, use all-capital letters for constants (called
&ldquo;final&rdquo; in Java), with underbars where camelCase would
be used. &nbsp;</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2">For non-package, non-module
identifiers, use use camelCase for non-constants.</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2">Avoid redefining, except to cache
locally, identifiers that have an identity with the global object
in important JavaScript programming environments. &nbsp;Examples of
such environments include the browser object model (bom). &nbsp;One
of these identifiers is &lsquo;self&rsquo;, and another one that is
not used in the bom but is popular in other JavaScript
implementations is &lsquo;global&rsquo;. &nbsp;See</span>
<span class="c8 c2"><a class="c11" href=
""></a></span><span class="c2">.</span><span class="c2">&nbsp;</span></p>
<h4 class="c4"><a name="h.qzyye2slamkq" id=
"h.qzyye2slamkq"></a><span class="c2">Private and Protected
<p class="c4"><span class="c2">See the section on</span>
<span class="c8 c2"><a class="c11" href="#h.d4lmqaw7ag7v">private
properties in constructors</a></span><span class="c2">&nbsp;for
information on non-function private properties, and see the section
on functions for information</span> <span class="c8 c2"><a class=
"c11" href="#h.mcg2c9md73a0">on private
functions</a></span><span class="c2">&nbsp;and</span> <span class=
"c8 c2"><a class="c11" href="#h.gp0wmyazdmrv">on protected
functions</a></span><span class="c2">. &nbsp;</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2">Where it is not desirable to
maintain truly private objects by cloning them upon
&lsquo;get&rsquo; method invocations, simply name them with a
double-underbar prefix:
<p class="c10 c4"></p>
<p class="c4"><span class="c2">As with functions that are methods,
name package-protected (in the Java sense) non-method properties
with a single underbar prefix:
<h4 class="c4"><a name="h.gqcbxynmo05e" id=
<p class="c4"><span class="c2">Use</span> <span class="c12">var
that = this;</span><span class="c2">&nbsp;to conveniently provide
access to the &lsquo;this&rsquo; scope from private functions.
&nbsp;See the notes elsewhere on use of
<h4 class="c4"><a name="h.2bb8e58hujqv" id=
"h.2bb8e58hujqv"></a><span>&lsquo;match&rsquo; vs.
<p class="c4"><span class="c2">Use the</span> <span class=
"c12">RegExp</span><span class="c2">&nbsp;object &lsquo;test&rsquo;
method when you simply want to check if a regular expression
matches some text or not. &nbsp;If you want more information than
that, then use the</span> <span class=
"c12">String</span><span class="c2">&nbsp;object
&lsquo;match&rsquo; method.</span></p>
<h4 class="c4"><a name="h.fxtblqat5m91" id=
<p class="c4"><span class="c2">Always use '.' notation instead of
'[' notation where a dynamic key is not required.</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2">Be explicit if your code is
accessing the global scope:</span></p>
<ol class="c15" start="1">
<li class="c7 c4"><span class="c2">For initial access in a
JavaScript scope to non-GUI globals, use &lsquo;self&rsquo;&rsquo;
if available. &nbsp;Unfortunately, some JavaScript implementations
do not provide &lsquo;self&rsquo;; in that case, use
&lsquo;global&rsquo;. &nbsp;</span></li>
<li class="c4 c7"><span class="c2">For initial access in a
JavaScript scope to non-GUI globals, use
&lsquo;window&rsquo;&rsquo; if available. &nbsp;</span></li>
<li class="c7 c4"><span class="c2">There is an insignificant
performance drawback to using &lsquo;self&rsquo; and
&lsquo;window&rsquo; prefixes:</span> <span class="c8 c2"><a class=
"c11" href=
""></a></span><span class="c2">&nbsp;
While the difference comparitively is large, the slowest case is
around two million lookups per second. &nbsp;So in absolute terms,
for anything JavaScript will be used for, the difference is
<p class="c10 c4"></p>
<p class="c4"><span class="c2">This not only aids in readability
but opens the code up for optimization to compilers that would
prefer to avoid excess scope-chain lookups.</span></p>
<h4 class="c4"><a name="h.2jyz28hmjwg7" id=
"h.2jyz28hmjwg7"></a><span>Data Type Prefixing</span></h4>
<p class="c4"><span class="c2">With the exception of integer loop
counters, all identifiers should have data type prefixes.
<p class="c10 c4"></p>
<ol class="c15" start="1">
<li class="c7 c4"><span class="c2">'s' for string
<li class="c7 c4"><span class="c2">&lsquo;b&rsquo; for boolean
<li class="c7 c4"><span class="c2">'i' for integer
<ol class="c16" start="1">
<li class="c4 c5 c21"><span class="c2">Except for highly idiomatic
uses such as a loop counter, where no data type prefix is
<ol class="c15" start="4">
<li class="c7 c4"><span class="c2">'fl' for floating-point
<li class="c7 c4"><span class="c2">'o' for an 'object' that is not
used as a hash</span></li>
<li class="c7 c4"><span class="c2">'h' for an object that is used
as a hash</span></li>
<li class="c7 c4"><span class="c2">&lsquo;r&rsquo; for a regular
expression object</span></li>
<li class="c7 c4"><span class="c2">&lsquo;w&rsquo; for a window
<li class="c7 c4"><span class="c2">&lsquo;d&rsquo; for a document
<li class="c7 c4"><span class="c2">&lsquo;e&rsquo; for an
<li class="c7 c4"><span class="c2">'fn' for a function that is
passed as an argument (such as a callback function
('fnHandleRequest'), but not, for example, a class constructor, a
method, or a module name).</span></li>
<p class="c10 c4"></p>
<p class="c4"><span class="c2">While JavaScript was created with an
intentionally low barrier to entry, and therefore is loosely typed,
code that respects basic data types is much faster to work with
because the developer&rsquo;s intent can be discerned almost
instantly by others who read the code. &nbsp;Using type prefixes
enables us to &nbsp;read and modify code faster.</span></p>
<h3 class="c4"><a name="h.ple5ypf5m9e5" id=
"h.ple5ypf5m9e5"></a><span>Built-In Objects</span></h3>
<p class="c4"><span class="c2">Unless you are writing for an
absolutely performance-critical environment where you are sure no
other JavaScript will run, do not modify built-in objects or their
prototypes. &nbsp;This will enable your code to co-exist with
minimal effort with other code, and will avoid providing unwelcome
surprises for other developers.</span></p>
<p class="c10 c4"></p>
<h3 class="c4"><a name="h.4bmtqrp3gaqh" id=
<h4 class="c4"><a name="h.a7k9m0gp8wyc" id=
<p class="c4"><span class="c2">Performance in JavaScript is largely
driven by the underlying techniques used by the JavaScript
interpreter/just-in-time-compiler engines. &nbsp;Due to the
high-level nature of JavaScript, its performance characteristics
can be counterintuitive. &nbsp;</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2">For example, tests show that loops
written with syntax accessing the &lsquo;.length&rsquo; of an array
that lives outside of function scope on every iteration are
actually, on some browsers, slightly faster than those that cache
the array length. &nbsp;This must be due to the underlying
optimizations in the JavaScript interpreter, which are likely done
according to what kind of code commonly written by the JavaScript
user base most needs optimization:</span> <span class=
"c8 c2"><a class="c11" href=
<p class="c10 c4"></p>
<p class="c4"><span class="c2">However, happily, short loops do
optimize as expected:</span> <span class="c8 c2"><a class="c11"
""></a></span><span class="c2">&nbsp;
But the operations per second are so high, that it&rsquo;s hard to
imagine very many practical use-cases for this kind of
<p class="c10 c4"></p>
<p class="c4"><span class="c2">And in the same vein, notably, heap
access no longer slows down appreciably with respect to the growth
in heap size, as shown by this test:</span> <span class=
"c8 c2"><a class="c11" href=
<p class="c10 c4"></p>
<p class="c4"><span class="c2">The Rule of Thumb is: Write
JavaScript code that is succinct and readable first and foremost,
above performance considerations. &nbsp;Because JavaScript today is
so fast, outside of rare circumstances, many optimizations
don&rsquo;t make much (if any) difference.</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2">The Golden Rule is: Before you
commit code that is harder to read because of its optimizations,
challenge your assumptions about JavaScript performance at</span>
<span class="c8 c2"><a class="c11" href=
""></a></span><span class=
<h4 class="c4"><a name="h.ekd4cuwig14c" id=
<p class="c4"><span class="c2">Make use of caching where possible,
noting the above section on the futility of caching the
&lsquo;.length&rsquo; property of JavaScript arrays. &nbsp;Here is
an example of the utility (though not of great magnitude) of
caching regular expression objects:</span> <span class=
"c8 c2"><a class="c11" href=
""></a></span><span class="c2">&nbsp;.</span></p>
<h3 class="c4"><a name="h.ta1e3atvn4ac" id=
"h.ta1e3atvn4ac"></a><span>Messaging Data Formats</span></h3>
<h4 class="c4"><a name="h.dir2kok2h9gh" id=
"h.dir2kok2h9gh"></a><span>Which Messaging Data Format to
<p class="c4"><span class="c2">Use XML where the data is complex
and the payload is under 100 kilobytes. &nbsp;Use JSON in all other
<h4 class="c4"><a name="h.kdsc56tlnfrr" id=
"h.kdsc56tlnfrr"></a><span>Commenting JSON</span></h4>
<p class="c4"><span class="c2">Until JSON supports comments,
comment JSON by inserting keys named
<h3 class="c4"><a name="h.doey2srr2tvv" id=
"h.doey2srr2tvv"></a><span>Code Format</span></h3>
<h4 class="c4"><a name="h.gstz9pf40l15" id=
<p class="c4"><span class="c2">Code format should make the code
look consistent. &nbsp;It should not try to make it look correct.
&nbsp;&ldquo;Correct&rdquo; does not exist in matters of style.
&nbsp;Consistent code is much faster to work with.</span></p>
<h4 class="c4"><a name="h.c50416cnsfm2" id=
<p class="c4"><span class="c2">Because code indented with single
spaces looks the same everywhere, while code formatted with tabs
does not, use spaces only. &nbsp;Although this may be the fault of
the tools, it is a practical limitation.</span></p>
<h4 class="c4"><a name="h.btmp67td2cm0" id=
<p class="c4"><span class="c2">Indent four spaces for every level
of code indenting.</span></p>
<h4 class="c4"><a name="h.fql68ac253cb" id=
"h.fql68ac253cb"></a><span>Curly Braces</span></h4>
<p class="c4"><span class="c2">Preserve valuable vertical screen
real estate by keeping a curly brace on the same line as the code
that originates it.</span></p>
<h4 class="c4"><a name="h.65bieoxmoylx" id=
"h.65bieoxmoylx"></a><span>Line Length</span></h4>
<p class="c4"><span class="c2">Format the line length to be as long
as commonly available monitors on portable notebook computers will
<h4 class="c4"><a name="h.8cdivrfr57be" id=
"h.8cdivrfr57be"></a><span>Line Breaks</span></h4>
<p class="c4"><span class="c2">Ensure that there are three line
breaks (two blank lines) before:</span></p>
<ol class="c15" start="1">
<li class="c7 c4"><span class="c2">A function declaration that is
not a wrapper function for a module. &nbsp;(This allows the single
line breaks in a function to clearly appear within their
<p class="c10 c4"></p>
<p class="c4"><span class="c2">Ensure that there are two line
breaks (one blank line) before:</span></p>
<ol class="c15" start="1">
<li class="c7 c4"><span class="c2">A control statement such as
&lsquo;return&rsquo;, &lsquo;break&rsquo;, or
<p class="c10 c4"></p>
<p class="c4"><span class="c2">Ensure that there are two line
breaks (one blank line) after:</span></p>
<ol class="c15" start="1">
<li class="c7 c4"><span class="c2">The closing curly brace of
function declaration that is not a wrapper function for a
<p class="c10 c4"></p>
<p class="c4"><span class="c2">Provide a single line break
<ol class="c15" start="2">
<li class="c7 c4"><span class="c2">A statement terminator
<li class="c7 c4"><span class="c2">Code that creates a block (such
as an opening curly brace).</span></li>
<p class="c10 c4"></p>
<p class="c4"><span class="c2">Optionally break lines
<ol class="c15" start="1">
<li class="c7 c4"><span class="c2">A conditional operator
(including &lsquo;?&rsquo; and &lsquo;:&rsquo;)<br>
A &lsquo;case:&rsquo; statement</span></li>
<li class="c7 c4"><span class="c2">A mathematical
<p class="c4"><span class="c2">Do not use line-breaks in place of
semi-colons (see &lsquo;Statement Terminators&rsquo;,
<h4 class="c4"><a name="h.y0slwg6wa2m0" id=
"h.y0slwg6wa2m0"></a><span>Statement Terminators</span></h4>
<p class="c4"><span class="c2">Use only semi-colons for this, not
line breaks. &nbsp;Follow such semi-colons with line-breaks.
&nbsp;The only reason to do so is to avoid ambiguity to human code
readers, but such ambiguity can be challenging. &nbsp;</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2">For example, no semi-colon is
automatically inserted in place of a line break after a function
assignment that has as its next non-whitespace, non-comment program
text a pair of function-invocation parentheses, as shown in</span>
<span class="c8 c2"><a class="c11" href=
example</a></span><span class="c2">.</span></p>
<h4 class="c4"><a name="h.kyykh3cgp1v3" id=
"h.kyykh3cgp1v3"></a><span>Conditional Parentheses</span></h4>
<p class="c4"><span class="c2">Use a single space to bracket the
contents of conditional parentheses. &nbsp;This reduces clutter
around the central subject, the condition. &nbsp;The opening curly
brace can follow an &lsquo;if&rsquo; directly, as the distinction
between the letter (in this case, &lsquo;f&rsquo;) and the opening
parenthesis needs no extra emphasis. &nbsp;That lack of space in
turn serves to emphasize the central subject. &nbsp;Also, keep the
closing smooth parenthesis and the following curly brace from
visually colliding by using a space there.
<ol class="c15" start="1">
<li class="c7 c4"><span class="c12">if( foo === bar ) { . .
<li class="c7 c4"><span class="c12">while( foo-- ) { . .
<h4 class="c4"><a name="h.4vindrg87vh0" id=
"h.4vindrg87vh0"></a><span>Object Initializer Syntax</span></h4>
<p class="c4"><span class="c2">Keep a balance between compactness
and readability. &nbsp;Examples (json would only add double-quotes
around all the keys):</span></p>
<ol class="c15" start="1">
<li class="c7 c4"><span class="c12">{ foo: bar, bat: baz
<li class="c7 c4"><span class="c12">[ &lsquo;a&rsquo;,
&lsquo;b&rsquo;, &lsquo;c&rsquo; ]</span></li>
<h4 class="c4"><a name="h.cesukrsq658g" id=
"h.cesukrsq658g"></a><span>Testing for Equality</span></h4>
<p class="c4"><span class="c2">For readability and efficiency, test
for identity instead of equality wherever convenient. &nbsp;This
means using the operator &lsquo;===&rsquo; instead of the operator
&lsquo;==&rsquo;. &nbsp;</span></p>
<h4 class="c4"><a name="h.5bxtuuklgbu1" id=
<p class="c4"><span class="c2">For very reusable API, follow</span>
<span class="c8 c2"><a class="c11" href=
the Javadoc standards</a></span><span class="c2">, mapping them
over to JavaScript data types as needed. &nbsp;Document the data
type of parameterized hashes:</span> <span class="c12">@param
hFoo&lt;string&gt;</span><span class="c2">. &nbsp;In the class file
header, document all class (@class) and instance (@object)
<h3 class="c4"><a name="h.ouuy6zlmqea0" id=
<h4 class="c4"><a name="h.50ekesniokr6" id=
<p class="c4"><span>Never keep secrets on the client. &nbsp;If you
follow this golden rule, you&rsquo;ve done all you can to make your
client-side JavaScript secure. &nbsp;As for making client-side
JavaScript harder to crack, please see the section below called
&ldquo;Various Measures&rdquo;. &nbsp;</span></p>
<p class="c10 c4"></p>
<p class="c4"><span>Regarding server-side JavaScript, the same
&ldquo;harder to crack&rdquo; measures apply. &nbsp;Additionally,
on the server (regardless of language) be sure to filter out code
that would allow cross-site scripting (</span><span class=
"c8"><a class="c11" href=
<p class="c10 c4"></p>
<h3 class="c4"><a name="h.66i0v5gidbnw" id=
"h.66i0v5gidbnw"></a><span>Various Measures</span></h3>
<h4 class="c4"><a name="h.4y5hypttfa2b" id=
<p class="c4"><span class="c2">Specify the base you intend to use
(usually 10), to avoid making it easy for an attacker to convert
your base to 8 by prepending a &ldquo;0&rdquo; to the first
argument to parseInt.</span></p>
<h4 class="c4"><a name="h.2fjo1pu4og4o" id=
<p class="c4"><span class="c2">Avoid storing any private values in
this property, because it is preserved from one page to another and
from one domain to another.</span></p>
<h4 class="c4"><a name="h.hlyfrkimu3vx" id=
<p class="c4"><span class="c2">JavaScript values set from Android
native Java will persist across page loads. &nbsp;So only
non-sensitive info should be set there, or it should be cleaned up
on page unload.</span></p>
<h3 class="c4"><a name="h.7mk617fpkpcb" id=
"h.7mk617fpkpcb"></a><span>External Environments</span></h3>
<p class="c4"><span class="c2">JavaScript is commonly used for
working with the document object model (dom) on the Web browser,
and for server-side handling of the Web front tier, such as with
NodeJS. &nbsp;Therefore, a JavaScript standard should include best
practices where there is substantial gain in these
<h4 class="c4"><a name="h.pzvpng843eki" id=
<p class="c4"><span class="c2">If you are doing</span> <span class=
"c8 c2"><a class="c11" href=
programming-in-the-large</a></span><span class="c2">, avoid
JavaScript frameworks that will make this difficult, such as
jQueryUI. &nbsp;Keep in mind that most of the vast audience of
JavaScript frameworks is doing</span> <span class="c8 c2"><a class=
"c11" href=
programming-in-the-small</a></span><span class="c2">. &nbsp;Reflect
first upon what you are doing.</span></p>
<h4 class="c4"><a name="h.tdcjhyy551yk" id=
"h.tdcjhyy551yk"></a><span>Document Object Model</span></h4>
<p class="c4"><span class="c2">Use cascading style sheet class
names (css) instead of directly setting cascading style sheet
properties except where unavoidable (such as in some animation
code). &nbsp;This maintains a separation between presentation and
logic. &nbsp;</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2">Do not develop code to uniquefy
document object model element &lsquo;id&rsquo; attribute values.
&nbsp;Use css classnames or html5 attributes instead.
&nbsp;&lsquo;id&rsquo; attribute values should already be unique
enough to support their use anywhere.</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2">Outside of dedicated templating
mechanisms and template input written in JavaScript, avoid writing
html in JavaScript wherever possible. &nbsp;Use a template
mechanism such as</span> <span class="c8 c2"><a class="c11" href=
"">handlebars</a></span><span class=
"c2">&nbsp;to keep html out of your JavaScript. &nbsp;</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2">Keep your custom code separate from
the &lsquo;this&rsquo; scope of dom objects. &nbsp;This will help
keep your code encapsulated and when debugging,
<h4 class="c4"><a name="h.tog6jfmkpt05" id=
<p class="c4"><span class="c2">For performance reasons, NodeJS must
use callbacks extensively. &nbsp;This is a JavaScript web server
pattern, not a JavaScript web application pattern. &nbsp;Steer out
of this in your code where possible. &nbsp;</span></p>
<p class="c10 c4"></p>
<p class="c4"><span class="c2">Recall that NodeJS files add to the
whole context. &nbsp;Therefore, avoid polluting the global
namespace by keeping your code entirely within modules.</span></p>
<hr style="page-break-before:always;display:none;">
<h3 class="c4 c14"><a name="h.sgxlj3zh0gqn" id=
"h.sgxlj3zh0gqn"></a><span class="c6 c9">GNU Free Documentation
<p class="c4 c14"><span class="c3">Version 1.3, 3 November
<p class="c4"><span class="c3">Copyright &copy; 2000, 2001, 2002,
2007, 2008 Free Software Foundation, Inc. &lt;</span><span class=
"c8 c6 c22"><a class="c11" href=
""></a></span><span class=
<p class="c4"><span class="c3">Everyone is permitted to copy and
distribute verbatim copies of this license document, but changing
it is not allowed.</span></p>
<h4 class="c4"><a name="h.e93ad1j6byjw" id=
"h.e93ad1j6byjw"></a><span class="c1">0. PREAMBLE</span></h4>
<p class="c4"><span class="c3">The purpose of this License is to
make a manual, textbook, or other functional and useful document
"free" in the sense of freedom: to assure everyone the effective
freedom to copy and redistribute it, with or without modifying it,
either commercially or noncommercially. Secondarily, this License
preserves for the author and publisher a way to get credit for
their work, while not being considered responsible for
modifications made by others.</span></p>
<p class="c4"><span class="c3">This License is a kind of
"copyleft", which means that derivative works of the document must
themselves be free in the same sense. It complements the GNU
General Public License, which is a copyleft license designed for
free software.</span></p>
<p class="c4"><span class="c3">We have designed this License in
order to use it for manuals for free software, because free
software needs free documentation: a free program should come with
manuals providing the same freedoms that the software does. But
this License is not limited to software manuals; it can be used for
any textual work, regardless of subject matter or whether it is
published as a printed book. We recommend this License principally
for works whose purpose is instruction or reference.</span></p>
<h4 class="c4"><a name="h.ps02bkv1r9r3" id=
"h.ps02bkv1r9r3"></a><span class="c1">1. APPLICABILITY AND
<p class="c4"><span class="c3">This License applies to any manual
or other work, in any medium, that contains a notice placed by the
copyright holder saying it can be distributed under the terms of
this License. Such a notice grants a world-wide, royalty-free
license, unlimited in duration, to use that work under the
conditions stated herein. The "Document", below, refers to any such
manual or work. Any member of the public is a licensee, and is
addressed as "you". You accept the license if you copy, modify or
distribute the work in a way requiring permission under copyright
<p class="c4"><span class="c3">A "Modified Version" of the Document
means any work containing the Document or a portion of it, either
copied verbatim, or with modifications and/or translated into
another language.</span></p>
<p class="c4"><span class="c3">A "Secondary Section" is a named
appendix or a front-matter section of the Document that deals
exclusively with the relationship of the publishers or authors of
the Document to the Document's overall subject (or to related
matters) and contains nothing that could fall directly within that
overall subject. (Thus, if the Document is in part a textbook of
mathematics, a Secondary Section may not explain any mathematics.)
The relationship could be a matter of historical connection with
the subject or with related matters, or of legal, commercial,
philosophical, ethical or political position regarding
<p class="c4"><span class="c3">The "Invariant Sections" are certain
Secondary Sections whose titles are designated, as being those of
Invariant Sections, in the notice that says that the Document is
released under this License. If a section does not fit the above
definition of Secondary then it is not allowed to be designated as
Invariant. The Document may contain zero Invariant Sections. If the
Document does not identify any Invariant Sections then there are
<p class="c4"><span class="c3">The "Cover Texts" are certain short
passages of text that are listed, as Front-Cover Texts or
Back-Cover Texts, in the notice that says that the Document is
released under this License. A Front-Cover Text may be at most 5
words, and a Back-Cover Text may be at most 25 words.</span></p>
<p class="c4"><span class="c3">A "Transparent" copy of the Document
means a machine-readable copy, represented in a format whose
specification is available to the general public, that is suitable
for revising the document straightforwardly with generic text
editors or (for images composed of pixels) generic paint programs
or (for drawings) some widely available drawing editor, and that is
suitable for input to text formatters or for automatic translation
to a variety of formats suitable for input to text formatters. A
copy made in an otherwise Transparent file format whose markup, or
absence of markup, has been arranged to thwart or discourage
subsequent modification by readers is not Transparent. An image
format is not Transparent if used for any substantial amount of
text. A copy that is not "Transparent" is called
<p class="c4"><span class="c3">Examples of suitable formats for
Transparent copies include plain ASCII without markup, Texinfo
input format, LaTeX input format, SGML or XML using a publicly
available DTD, and standard-conforming simple HTML, PostScript or
PDF designed for human modification. Examples of transparent image
formats include PNG, XCF and JPG. Opaque formats include
proprietary formats that can be read and edited only by proprietary
word processors, SGML or XML for which the DTD and/or processing
tools are not generally available, and the machine-generated HTML,
PostScript or PDF produced by some word processors for output
purposes only.</span></p>
<p class="c4"><span class="c3">The "Title Page" means, for a
printed book, the title page itself, plus such following pages as
are needed to hold, legibly, the material this License requires to
appear in the title page. For works in formats which do not have
any title page as such, "Title Page" means the text near the most
prominent appearance of the work's title, preceding the beginning
of the body of the text.</span></p>
<p class="c4"><span class="c3">The "publisher" means any person or
entity that distributes copies of the Document to the
<p class="c4"><span class="c3">A section "Entitled XYZ" means a
named subunit of the Document whose title either is precisely XYZ
or contains XYZ in parentheses following text that translates XYZ
in another language. (Here XYZ stands for a specific section name
mentioned below, such as "Acknowledgements", "Dedications",
"Endorsements", or "History".) To "Preserve the Title" of such a
section when you modify the Document means that it remains a
section "Entitled XYZ" according to this definition.</span></p>
<p class="c4"><span class="c3">The Document may include Warranty
Disclaimers next to the notice which states that this License
applies to the Document. These Warranty Disclaimers are considered
to be included by reference in this License, but only as regards
disclaiming warranties: any other implication that these Warranty
Disclaimers may have is void and has no effect on the meaning of
this License.</span></p>
<h4 class="c4"><a name="h.l5t6umkmjz4q" id=
"h.l5t6umkmjz4q"></a><span class="c1">2. VERBATIM
<p class="c4"><span class="c3">You may copy and distribute the
Document in any medium, either commercially or noncommercially,
provided that this License, the copyright notices, and the license
notice saying this License applies to the Document are reproduced
in all copies, and that you add no other conditions whatsoever to
those of this License. You may not use technical measures to
obstruct or control the reading or further copying of the copies
you make or distribute. However, you may accept compensation in
exchange for copies. If you distribute a large enough number of
copies you must also follow the conditions in section 3.</span></p>
<p class="c4"><span class="c3">You may also lend copies, under the
same conditions stated above, and you may publicly display
<h4 class="c4"><a name="h.18mhs1nje4vt" id=
"h.18mhs1nje4vt"></a><span class="c1">3. COPYING IN
<p class="c4"><span class="c3">If you publish printed copies (or
copies in media that commonly have printed covers) of the Document,
numbering more than 100, and the Document's license notice requires
Cover Texts, you must enclose the copies in covers that carry,
clearly and legibly, all these Cover Texts: Front-Cover Texts on
the front cover, and Back-Cover Texts on the back cover. Both
covers must also clearly and legibly identify you as the publisher
of these copies. The front cover must present the full title with
all words of the title equally prominent and visible. You may add
other material on the covers in addition. Copying with changes
limited to the covers, as long as they preserve the title of the
Document and satisfy these conditions, can be treated as verbatim
copying in other respects.</span></p>
<p class="c4"><span class="c3">If the required texts for either
cover are too voluminous to fit legibly, you should put the first
ones listed (as many as fit reasonably) on the actual cover, and
continue the rest onto adjacent pages.</span></p>
<p class="c4"><span class="c3">If you publish or distribute Opaque
copies of the Document numbering more than 100, you must either
include a machine-readable Transparent copy along with each Opaque
copy, or state in or with each Opaque copy a computer-network
location from which the general network-using public has access to
download using public-standard network protocols a complete
Transparent copy of the Document, free of added material. If you
use the latter option, you must take reasonably prudent steps, when
you begin distribution of Opaque copies in quantity, to ensure that
this Transparent copy will remain thus accessible at the stated
location until at least one year after the last time you distribute
an Opaque copy (directly or through your agents or retailers) of
that edition to the public.</span></p>
<p class="c4"><span class="c3">It is requested, but not required,
that you contact the authors of the Document well before
redistributing any large number of copies, to give them a chance to
provide you with an updated version of the Document.</span></p>
<h4 class="c4"><a name="h.llaqq9qc46ts" id=
"h.llaqq9qc46ts"></a><span class="c1">4. MODIFICATIONS</span></h4>
<p class="c4"><span class="c3">You may copy and distribute a
Modified Version of the Document under the conditions of sections 2
and 3 above, provided that you release the Modified Version under
precisely this License, with the Modified Version filling the role
of the Document, thus licensing distribution and modification of
the Modified Version to whoever possesses a copy of it. In
addition, you must do these things in the Modified
<ol class="c15" start="1">
<li class="c19 c4"><span class="c3">A. Use in the Title Page (and
on the covers, if any) a title distinct from that of the Document,
and from those of previous versions (which should, if there were
any, be listed in the History section of the Document). You may use
the same title as a previous version if the original publisher of
that version gives permission.</span></li>
<li class="c19 c4"><span class="c3">B. List on the Title Page, as
authors, one or more persons or entities responsible for authorship
of the modifications in the Modified Version, together with at
least five of the principal authors of the Document (all of its
principal authors, if it has fewer than five), unless they release
you from this requirement.</span></li>
<li class="c19 c4"><span class="c3">C. State on the Title page the
name of the publisher of the Modified Version, as the
<li class="c19 c4"><span class="c3">D. Preserve all the copyright
notices of the Document.</span></li>
<li class="c19 c4"><span class="c3">E. Add an appropriate copyright
notice for your modifications adjacent to the other copyright
<li class="c19 c4"><span class="c3">F. Include, immediately after
the copyright notices, a license notice giving the public
permission to use the Modified Version under the terms of this
License, in the form shown in the Addendum below.</span></li>
<li class="c19 c4"><span class="c3">G. Preserve in that license
notice the full lists of Invariant Sections and required Cover
Texts given in the Document's license notice.</span></li>
<li class="c19 c4"><span class="c3">H. Include an unaltered copy of
this License.</span></li>
<li class="c19 c4"><span class="c3">I. Preserve the section
Entitled "History", Preserve its Title, and add to it an item
stating at least the title, year, new authors, and publisher of the
Modified Version as given on the Title Page. If there is no section
Entitled "History" in the Document, create one stating the title,
year, authors, and publisher of the Document as given on its Title
Page, then add an item describing the Modified Version as stated in
the previous sentence.</span></li>
<li class="c19 c4"><span class="c3">J. Preserve the network
location, if any, given in the Document for public access to a
Transparent copy of the Document, and likewise the network
locations given in the Document for previous versions it was based
on. These may be placed in the "History" section. You may omit a
network location for a work that was published at least four years
before the Document itself, or if the original publisher of the
version it refers to gives permission.</span></li>
<li class="c19 c4"><span class="c3">K. For any section Entitled
"Acknowledgements" or "Dedications", Preserve the Title of the
section, and preserve in the section all the substance and tone of
each of the contributor acknowledgements and/or dedications given
<li class="c19 c4"><span class="c3">L. Preserve all the Invariant
Sections of the Document, unaltered in their text and in their
titles. Section numbers or the equivalent are not considered part
of the section titles.</span></li>
<li class="c19 c4"><span class="c3">M. Delete any section Entitled
"Endorsements". Such a section may not be included in the Modified
<li class="c19 c4"><span class="c3">N. Do not retitle any existing
section to be Entitled "Endorsements" or to conflict in title with
any Invariant Section.</span></li>
<li class="c4 c19"><span class="c3">O. Preserve any Warranty
<p class="c4"><span class="c3">If the Modified Version includes new
front-matter sections or appendices that qualify as Secondary
Sections and contain no material copied from the Document, you may
at your option designate some or all of these sections as
invariant. To do this, add their titles to the list of Invariant
Sections in the Modified Version's license notice. These titles
must be distinct from any other section titles.</span></p>
<p class="c4"><span class="c3">You may add a section Entitled
"Endorsements", provided it contains nothing but endorsements of
your Modified Version by various parties&mdash;for example,
statements of peer review or that the text has been approved by an
organization as the authoritative definition of a
<p class="c4"><span class="c3">You may add a passage of up to five
words as a Front-Cover Text, and a passage of up to 25 words as a
Back-Cover Text, to the end of the list of Cover Texts in the
Modified Version. Only one passage of Front-Cover Text and one of
Back-Cover Text may be added by (or through arrangements made by)
any one entity. If the Document already includes a cover text for
the same cover, previously added by you or by arrangement made by
the same entity you are acting on behalf of, you may not add
another; but you may replace the old one, on explicit permission
from the previous publisher that added the old one.</span></p>
<p class="c4"><span class="c3">The author(s) and publisher(s) of
the Document do not by this License give permission to use their
names for publicity for or to assert or imply endorsement of any
Modified Version.</span></p>
<h4 class="c4"><a name="h.k53hm87wq5ad" id=
"h.k53hm87wq5ad"></a><span class="c1">5. COMBINING
<p class="c4"><span class="c3">You may combine the Document with
other documents released under this License, under the terms
defined in section 4 above for modified versions, provided that you
include in the combination all of the Invariant Sections of all of
the original documents, unmodified, and list them all as Invariant
Sections of your combined work in its license notice, and that you
preserve all their Warranty Disclaimers.</span></p>
<p class="c4"><span class="c3">The combined work need only contain
one copy of this License, and multiple identical Invariant Sections
may be replaced with a single copy. If there are multiple Invariant
Sections with the same name but different contents, make the title
of each such section unique by adding at the end of it, in
parentheses, the name of the original author or publisher of that
section if known, or else a unique number. Make the same adjustment
to the section titles in the list of Invariant Sections in the
license notice of the combined work.</span></p>
<p class="c4"><span class="c3">In the combination, you must combine
any sections Entitled "History" in the various original documents,
forming one section Entitled "History"; likewise combine any
sections Entitled "Acknowledgements", and any sections Entitled
"Dedications". You must delete all sections Entitled
<h4 class="c4"><a name="h.5hw1y38mvgm0" id=
"h.5hw1y38mvgm0"></a><span class="c1">6. COLLECTIONS OF
<p class="c4"><span class="c3">You may make a collection consisting
of the Document and other documents released under this License,
and replace the individual copies of this License in the various
documents with a single copy that is included in the collection,
provided that you follow the rules of this License for verbatim
copying of each of the documents in all other respects.</span></p>
<p class="c4"><span class="c3">You may extract a single document
from such a collection, and distribute it individually under this
License, provided you insert a copy of this License into the
extracted document, and follow this License in all other respects
regarding verbatim copying of that document.</span></p>
<h4 class="c4"><a name="h.ge7kihin0kaw" id=
"h.ge7kihin0kaw"></a><span class="c1">7. AGGREGATION WITH
<p class="c4"><span class="c3">A compilation of the Document or its
derivatives with other separate and independent documents or works,
in or on a volume of a storage or distribution medium, is called an
"aggregate" if the copyright resulting from the compilation is not
used to limit the legal rights of the compilation's users beyond
what the individual works permit. When the Document is included in
an aggregate, this License does not apply to the other works in the
aggregate which are not themselves derivative works of the
<p class="c4"><span class="c3">If the Cover Text requirement of
section 3 is applicable to these copies of the Document, then if
the Document is less than one half of the entire aggregate, the
Document's Cover Texts may be placed on covers that bracket the
Document within the aggregate, or the electronic equivalent of
covers if the Document is in electronic form. Otherwise they must
appear on printed covers that bracket the whole
<h4 class="c4"><a name="h.ghx68256x0cw" id=
"h.ghx68256x0cw"></a><span class="c1">8. TRANSLATION</span></h4>
<p class="c4"><span class="c3">Translation is considered a kind of
modification, so you may distribute translations of the Document
under the terms of section 4. Replacing Invariant Sections with
translations requires special permission from their copyright
holders, but you may include translations of some or all Invariant
Sections in addition to the original versions of these Invariant
Sections. You may include a translation of this License, and all
the license notices in the Document, and any Warranty Disclaimers,
provided that you also include the original English version of this
License and the original versions of those notices and disclaimers.
In case of a disagreement between the translation and the original
version of this License or a notice or disclaimer, the original
version will prevail.</span></p>
<p class="c4"><span class="c3">If a section in the Document is
Entitled "Acknowledgements", "Dedications", or "History", the
requirement (section 4) to Preserve its Title (section 1) will
typically require changing the actual title.</span></p>
<h4 class="c4"><a name="h.wx8aftj0yhb7" id=
"h.wx8aftj0yhb7"></a><span class="c1">9. TERMINATION</span></h4>
<p class="c4"><span class="c3">You may not copy, modify,
sublicense, or distribute the Document except as expressly provided
under this License. Any attempt otherwise to copy, modify,
sublicense, or distribute it is void, and will automatically
terminate your rights under this License.</span></p>
<p class="c4"><span class="c3">However, if you cease all violation
of this License, then your license from a particular copyright
holder is reinstated (a) provisionally, unless and until the
copyright holder explicitly and finally terminates your license,
and (b) permanently, if the copyright holder fails to notify you of
the violation by some reasonable means prior to 60 days after the
<p class="c4"><span class="c3">Moreover, your license from a
particular copyright holder is reinstated permanently if the
copyright holder notifies you of the violation by some reasonable
means, this is the first time you have received notice of violation
of this License (for any work) from that copyright holder, and you
cure the violation prior to 30 days after your receipt of the
<p class="c4"><span class="c3">Termination of your rights under
this section does not terminate the licenses of parties who have
received copies or rights from you under this License. If your
rights have been terminated and not permanently reinstated, receipt
of a copy of some or all of the same material does not give you any
rights to use it.</span></p>
<h4 class="c4"><a name="h.l15xp4veaojo" id=
"h.l15xp4veaojo"></a><span class="c1">10. FUTURE REVISIONS OF THIS
<p class="c4"><span class="c3">The Free Software Foundation may
publish new, revised versions of the GNU Free Documentation License
from time to time. Such new versions will be similar in spirit to
the present version, but may differ in detail to address new
problems or concerns. See</span> <span class="c8 c6 c22"><a class=
"c11" href=
""></a></span><span class="c3">.</span></p>
<p class="c4"><span class="c3">Each version of the License is given
a distinguishing version number. If the Document specifies that a
particular numbered version of this License "or any later version"
applies to it, you have the option of following the terms and
conditions either of that specified version or of any later version
that has been published (not as a draft) by the Free Software
Foundation. If the Document does not specify a version number of
this License, you may choose any version ever published (not as a
draft) by the Free Software Foundation. If the Document specifies
that a proxy can decide which future versions of this License can
be used, that proxy's public statement of acceptance of a version
permanently authorizes you to choose that version for the
<h4 class="c4"><a name="h.txe1ejocoaau" id=
"h.txe1ejocoaau"></a><span class="c1">11. RELICENSING</span></h4>
<p class="c4"><span class="c3">"Massive Multiauthor Collaboration
Site" (or "MMC Site") means any World Wide Web server that
publishes copyrightable works and also provides prominent
facilities for anybody to edit those works. A public wiki that
anybody can edit is an example of such a server. A "Massive
Multiauthor Collaboration" (or "MMC") contained in the site means
any set of copyrightable works thus published on the MMC
<p class="c4"><span class="c3">"CC-BY-SA" means the Creative
Commons Attribution-Share Alike 3.0 license published by Creative
Commons Corporation, a not-for-profit corporation with a principal
place of business in San Francisco, California, as well as future
copyleft versions of that license published by that same
<p class="c4"><span class="c3">"Incorporate" means to publish or
republish a Document, in whole or in part, as part of another
<p class="c4"><span class="c3">An MMC is "eligible for relicensing"
if it is licensed under this License, and if all works that were
first published under this License somewhere other than this MMC,
and subsequently incorporated in whole or in part into the MMC, (1)
had no cover texts or invariant sections, and (2) were thus
incorporated prior to November 1, 2008.</span></p>
<p class="c4"><span class="c3">The operator of an MMC Site may
republish an MMC contained in the site under CC-BY-SA on the same
site at any time before August 1, 2009, provided the MMC is
eligible for relicensing.</span></p>
<p class="c10 c4"></p>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment