JavaScript Tips

 

•Semicolon insertion

–-When the compiler sees an error, it attempts to replace a nearby linefeed with a semicolon and try again.

–-This should alarm you.

–-It can mask errors.

–-Always use the full, correct forms, including semicolons.

•Comma

–-Good: [1, 2, 3]

–-Bad:  [1, 2, 3,]

 

•Required block

–-Good:

§if (a) {

§    b();

§}

–-Bad:

§if (a) b();

•== and !=

–-Bad

§if (a == null) { ... }

–-Good:

§if (a === null) { ... }

§if (!a) { ... }

 

•Common subexpression removal

•Loop invariant removal

for (var i = 0; i < divs.length; i += 1) {

    divs[i].style.color = "black";

    divs[i].style.border = thickness + 'px solid blue';

    divs[i].style.backgroundColor = "white";

}

----->
 

var border = thickness + 'px solid blue',

    nrDivs = divs.length;

for (var i = 0; i < nrDivs; i += 1) {

    var ds = divs[i].style;

    ds.color = "black";

    ds.border = border;

    ds.backgroundColor = "white";

}

 

•Strings

–-Concatenation with +

§Each operation allocates memory

–foo = a + b;

–-Concatenate with array.join('')

§The contents of an array are concatenated into a single string

–-Comparison

§a) foo = a + b; vs b) foo = [a, b].join('');

–a)  <  b)

§a) foo = 'a' + 'b'; vs b) foo = ['a', 'b'].join('');

–a)  >  b)

 

•-Place <script src> tags as close to the bottom of the body as possible. (Also, place CSS <link> as high in the head as possible.)

•-Minify and gzip script files.

•-Reduce the number of script files as much as possible.

•<script></script>

–<!--  // -->

§Hack for Mosaic and Navigator 1.0.

–language=javascript

§Deprecated.

–src=URL

§Highly recommended.

§Don't put code on pages.

–type=text/javascript

§Ignored.

 

•document.write

–-Allows JavaScript to produce HTML text.

–-Before onload: Inserts HTML text into the document.

–-After onload: Uses HTML text to replace the current document.

–-Not recommended.

 

•name

–-Identifies values in form data

–-Identifies a window/frame

•id

–-Uniquely identifies an element

 

•document.all

–-Microsoft feature, rejected by W3C and most other browsers.

–-It acts as a function or array for accessing elements by position, name, or id.

–-Avoid it.

 

•Manipulating elements

–-Old

§if (my_image.complete) {

§    my_image.src = superurl;

§}

–-New

§if (my_image.getAttribute('complete')) {

§    my_image.setAttribute('src', superurl);

§}

 

•Element id 를 통한 접근

–var oElement = null;

–if ( document.getElementById ) {

– oElement = document.getElementById(ID);

–} else if ( document.layers ) {

– oElement = document.layers[ID];

–} else if ( document.all ) {

– oElement = document.all[ID];

–}

 

•JavaScript XMLHttpRequest

•DOM3 Events, Core

•2006

•http://www.w3.org/TR/XMLHttpRequest/

•http://search.yahoo.com/search?p=XMLHttpRequest&fr=yfp-t-501&toggle=1&cop=mss&ei=UTF-8&fp_ip=KR&vc=

var oHttp = false;

var aMsxmlType = [

'MSXML2.XMLHTTP.5.0',

'MSXML2.XMLHTTP.4.0',

'MSXML2.XMLHTTP.3.0',

'MSXML2.XMLHTTP',

'Microsoft.XMLHTTP'

];

if ( window.XMLHttpRequest ) {

try {

oHttp = new XMLHttpRequest();

} catch(e) {

oHttp = false;

}

} else if ( window.ActiveXObject ) {

for ( i=0; i<this.aMsxmlType.length; i++ ) {

try {

oHttp = new ActiveXObject(this.aMsxmlType[i]);

if ( oHttp ) {

break;

}

} catch(e) {

oHttp = false;

}

}

}

 

•JavaScritp XMLDOM

–var oXmlDoc = null;

–if ( window.ActiveXObject ) {

– oXmlDoc = new ActiveXObject("Microsoft.XMLDOM");

–} else if ( document.implementation && document.implementation.createDocument ) {

– oXmlDoc = document.implementation.createDocument("", "", null);

–}

•JavaScript XML DOMParser

–IE/FF (xml file)

§Using XMLDOMObject. getElementsByTagName(..)

–FF (xml string)

§var oDomParser=new DOMParser();

§var oDoc = oDomParser.parseFromString(XMLSTRING,"text/xml");