JavaScript

Created 2011 February 20. Updated 2011 June 2.

Overview

• JavaScript (mozilla.org)
  • Reference (mozilla.org)
• JavaScript Garden (bonsaiden.github.com) Quirky parts documented and explained

Resources

• EveryJS (Tom Dale everyjs.com) JavaScript tools summarised
• microjs (Thomas Fuchs microjs.com) Microframeworks summarised

Link Drop

• Ace (ace.ajax.org) A standalone code editor written in JavaScript
• bind (MDC Doc Center mozilla.org) bob = func.bind(that); bob();
• Binding Scope in JavaScript (Robert Sosinski robertsosinski.com) function(){}.bind(that);
• Getting the scrollbar width in pixels (Matthew Eernisse 2006 fleegix.org)
• JavaScript and URLs (Chris Shiflett 2011 February shiflett.org)
• Online JavaScript/CSS Compression Using YUI Compressor (refresh-sf.com)
• Optimize the Performance of Widgets, Buttons & More A look at loads of popular widgets and their affect on page load
• Why we should support users with no Javascript (Emma Sax 2011 March punkchip.com)

Libraries

• Ender - the no-library library (ender.no.de)
• jQuery: The Write Less, Do More, JavaScript Library (jquery.com)

Selector Engines

• Sizzle (sizzlejs.com) The one that lives in jQuery
• Qwery (Dustin Diaz 2011 github.com) To check out

Quality Assurance

• JSHint (jshint.com) A fork of JSLint
• JSLint (jslint.com) By Douglas Crockford

Server-Side Funk

• node.js
  • NowJS (nowjs.com) Makes realtime web apps really easy
  • Understanding node.js (debuggable.com 2010 May)

Canvas and WebGL

• three.js (Mr Doob github.com)

HTTP Status Detection

• JavaScript HTTP Status detection (Marv 2007 tough-to-find.blogspot.com)
• Is it possible to retrieve http response status? (bytes.com) XHR handles server-side redirects transparently, so it cannot be used to detect whether a redirect took place. The value of the status property is either a success status code (2xx) or an error status code (4xx or 5xx)[1], never that of a redirect (3xx).

Notes

String.split() with a RegExp separator

This one caught me out with its cross-browser crazy-bandit style, see JavaScript split Bugs: Fixed! (2007 stevenlevithan.com)

String.split() with a Limit

When a limit is used the last element of the returned array does not contain the rest of the string. Seems strange to me but there is a work around, which was provided by Nick Craver on in reply to the question Split string once in javascript? (stackoverflow.com)

var split = string.split('|');
split = [split.shift(), split.join('|')];

For limits greater than 1 then array.splice could be used.

Variables Named Class in IE

var class; causes IE to raise an error.

Repeated RegExp.test Calls on Same RegExp with a Global Flag

Another one that caught me out. RegExp.test returned true the first time, but didn't the second because it was no longer searching from the beginning of the string.

"... As with exec (or in combination with it), test called multiple times on the same global regular expression instance will advance past the previous match."

Mozilla JavaScript Docs 2011 March 20

Solution was to use RegExp.lastIndex = 0 after each use of RegExp.test.

RegExp.test (mozilla.org), RegExp.lastIndex (mozilla.org)

String.match() gotcha

When doing a RegExp match a g flag causes the capture parenthesis to no longer capture. Just do the match without the g flag.

When Using console.log

Avoid raising errors without Firebug by using the following before using console.log:

window['console'] = window['console'] || {log:function(){}};