(public).sospep.subjects ~ view article ~ EXAMPLE-javascript-best-practices-w3c

<h1 style="text-align: center;">javascript best practices</h1>
<h2>WHAT</h2>
<ol>
<li>] a collection of best practices from the W3C</li>
</ol>
<h2>[WHY]</h2>
<ol>
<li>]</li>
</ol>
<h2>[WHEN]</h2>
<ol>
<li>]</li>
</ol>
<h2>[WHERE]</h2>
<ol>
<li><strong>] READ THE FULL ARTICLE</strong></li>
<ol>
<li>]&nbsp;<a href="http://www.w3.org/wiki/JavaScript_best_practices" target="_blank">http://www.w3.org/wiki/JavaScript_best_practices</a> -&nbsp;</li>
</ol></ol>
<h2>[EXAMPLE]</h2>
<ol>
<li><a href="http://www.w3.org/wiki/JavaScript_best_practices#Introduction" target="_blank"><span class="toctext">Introduction</span></a>&nbsp;</li>
<ol>
<li>]</li>
</ol>
<li class="toclevel-1 tocsection-2"><a href="http://www.w3.org/wiki/JavaScript_best_practices#Call_things_by_their_name_.E2.80.94_easy.2C_short_and_readable_variable_and_function_names" target="_blank"><span class="toctext">Call things by their name &mdash; easy, short and readable variable and function names</span></a></li>
<ol>
<li class="toclevel-1 tocsection-2">]</li>
<li class="toclevel-1 tocsection-2">] cc namingConventions</li>
</ol>
<li class="toclevel-1 tocsection-3"><a href="http://www.w3.org/wiki/JavaScript_best_practices#Avoid_globals" target="_blank"><span class="toctext">Avoid globals</span></a>&nbsp;</li>
<ol>
<li class="toclevel-1 tocsection-3">]</li>
</ol>
<li class="toclevel-1 tocsection-4"><a href="http://www.w3.org/wiki/JavaScript_best_practices#Stick_to_a_strict_coding_style" target="_blank"><span class="toctext">Stick to a strict coding style</span></a></li>
<ol>
<li class="toclevel-1 tocsection-4">] goal is consistency - naming conventions, ...</li>
</ol>
<li class="toclevel-1 tocsection-5"><a href="http://www.w3.org/wiki/JavaScript_best_practices#Comment_as_much_as_needed_but_not_more" target="_blank"><span class="toctext">Comment as much as needed but not more</span></a>&nbsp;</li>
<ol>
<li class="toclevel-1 tocsection-5">] Comments don&rsquo;t hurt anybody if you do them right,&nbsp;the trick is moderation.</li>
<li class="toclevel-1 tocsection-5">] Comment when there is an important thing to say, and</li>
<li class="toclevel-1 tocsection-5">] if you do comment use the&nbsp;/*<code>&nbsp;</code> */ notation.</li>
<li class="toclevel-1 tocsection-5">] Single line comments using <code>//</code> can be problematic if people minify your code without stripping comments and in general are less versatile.</li>
<li class="toclevel-1 tocsection-5">] TIP /* .... // */ - can comment out a code block, then enable it&nbsp;by adding a single slash before the opening /*</li>
</ol>
<li class="toclevel-1 tocsection-6"><a href="http://www.w3.org/wiki/JavaScript_best_practices#Avoid_mixing_with_other_technologies" target="_blank"><span class="toctext">Avoid mixing with other technologies</span></a>&nbsp;</li>
<ol>
<li class="toclevel-1 tocsection-6">] example css - avoid using js to set css attributes where you can, keep css to css, js to js&nbsp;</li>
</ol>
<li class="toclevel-1 tocsection-7"><a href="http://www.w3.org/wiki/JavaScript_best_practices#Use_shortcut_notation_when_it_makes_sense" target="_blank"><span class="toctext">Use shortcut notation when it makes sense</span></a>&nbsp;</li>
<ol>
<li class="toclevel-1 tocsection-7">&gt;] example use object literals vs object ?assignment statements?</li>
<li class="toclevel-1 tocsection-7">] <span style="background-color: #ff0000;">DONT&nbsp;</span>myCar = new Car()</li>
<li class="toclevel-1 tocsection-7">] myCar.color=red;</li>
<li class="toclevel-1 tocsection-7">] myCar.type=convertible;</li>
<li class="toclevel-1 tocsection-7">] myCar....= ... ;</li>
<li class="toclevel-1 tocsection-7">] <span style="background-color: #00ff00;">DO</span> var myCar = { color:red, type:convertible, ...:...} // avoids writing out myCar. in front of each property</li>
<li class="toclevel-1 tocsection-7">&gt;] example&nbsp;array literals VS&nbsp;array declarations</li>
<li class="toclevel-1 tocsection-7">] <span style="background-color: #ff0000;">DONT</span> var myCars = new Array()</li>
<li class="toclevel-1 tocsection-7">] myArray[0] = '1965 Mustang Convertible'</li>
<li class="toclevel-1 tocsection-7">] myArray[1]= '1966 Mustang 2+2'</li>
<li class="toclevel-1 tocsection-7">] <span style="background-color: #00ff00;">DO</span> myCars = ['1965 Mustang Convertible, '1966 Mustang 2+2'&nbsp;]</li>
</ol>
<li class="toclevel-1 tocsection-8"><a href="http://www.w3.org/wiki/JavaScript_best_practices#Modularize_.E2.80.94_one_function_per_task" target="_blank"><span class="toctext">Modularize &mdash; one function per task</span></a></li>
<ol>
<li class="toclevel-1 tocsection-8">] a general programming bp - create functions that fulfill one job at a time makes it easy for other developers to debug and change your code without having to scan through all the code to work out what code block performs what function.</li>
</ol>
<li class="toclevel-1 tocsection-9"><a href="http://www.w3.org/wiki/JavaScript_best_practices#Enhance_progressively" target="_blank"><span class="toctext">Enhance progressively</span></a></li>
<ol>
<li class="toclevel-1 tocsection-9">]</li>
<li class="toclevel-1 tocsection-9">] cc progressive-enhancemnt</li>
</ol>
<li class="toclevel-1 tocsection-10"><a href="http://www.w3.org/wiki/JavaScript_best_practices#Allow_for_configuration_and_translation" target="_blank"><span class="toctext">Allow for configuration and translation</span></a></li>
<li class="toclevel-1 tocsection-11"><a href="http://www.w3.org/wiki/JavaScript_best_practices#Avoid_heavy_nesting" target="_blank"><span class="toctext">Avoid heavy nesting</span></a></li>
<li class="toclevel-1 tocsection-12"><a href="http://www.w3.org/wiki/JavaScript_best_practices#Optimize_loops" target="_blank"><span class="toctext">Optimize loops</span></a></li>
<li class="toclevel-1 tocsection-13"><a href="http://www.w3.org/wiki/JavaScript_best_practices#Keep_DOM_access_to_a_minimum" target="_blank"><span class="toctext">Keep DOM access to a minimum</span></a></li>
<li class="toclevel-1 tocsection-14"><a href="http://www.w3.org/wiki/JavaScript_best_practices#Don.E2.80.99t_yield_to_browser_whims" target="_blank"><span class="toctext">Don&rsquo;t yield to browser whims</span></a></li>
<li class="toclevel-1 tocsection-15"><a href="http://www.w3.org/wiki/JavaScript_best_practices#Don.E2.80.99t_trust_any_data" target="_blank"><span class="toctext">Don&rsquo;t trust any data</span></a></li>
<li class="toclevel-1 tocsection-16"><a href="http://www.w3.org/wiki/JavaScript_best_practices#Add_functionality_with_JavaScript.2C_don.E2.80.99t_create_too_much_content" target="_blank"><span class="toctext">Add functionality with JavaScript, don&rsquo;t create too much content</span></a></li>
<li class="toclevel-1 tocsection-17"><a href="http://www.w3.org/wiki/JavaScript_best_practices#Build_on_the_shoulders_of_giants" target="_blank"><span class="toctext">Build on the shoulders of giants</span></a></li>
<li class="toclevel-1 tocsection-18"><a href="http://www.w3.org/wiki/JavaScript_best_practices#Development_code_is_not_live_code" target="_blank"><span class="toctext">Development code is not live code</span></a></li>
<li class="toclevel-1 tocsection-19"><a href="http://www.w3.org/wiki/JavaScript_best_practices#Summary" target="_blank"><span class="toctext">Summary</span></a></li>
</ol>
<h2>[HOW-T0]</h2>
<ol>
<li>]</li>
</ol>
<h2>[REFERENCE]</h2>
<ol>
<li>]&nbsp;</li>
</ol>

~ view article ~ Chapter] ch-025-best-practices FROM [ Book] language-javascript IN [ libraries] technology-developer-www