The Intermediate Javascript class will assume you have some exposure to Javascript, and/or have done some programming. The concentration is on writing solid, reusable, object oriented code, and on using Javascript as an application development language. Rather than covering any specific library (such as jQuery or Scriptaculous), we will stick with the language itself so you thoroughly understand what you are doing -- not just relying on under-the-hood magic.
The class will meet on Wednesday evenings, for two hours, for six weeks. You should bring your laptop and be ready to do exercises in class.
The tentative syllabus is below -- it may change depending on how quickly students are progressing. Prior to each week's class, a page will be linked to the class description that will have more details, assignment specifics, and code samples.
- Week one: Overview of Javascript basics. Arrays and objects, and initializing them using modern (JSON-like) syntax. Dynamically adding members to arrays and objects. Accessing object members with both dot syntax (object.property) and bracket syntax (object["property"]). Anonymous functions vs. named functions, and assigning functions to variables and object members. Keeping all your code inside objects to minimize use of global variables. Building DOM elements "manually" vs. innerHTML (and how utility functions can make this much cleaner and more intuitive). Using element id's vs. saving direct references to DOM elements. Also: using Firebug, Chrome/Safari developer tools, and other tools to help debug. Assignment: building a simple calendar widget.
- Week two: The "this" keyword. Callbacks, using function closures (vs. "old-school" approaches using evaluated strings). You will learn the power of closures, while also learning how they can lead to strange errors and hard to debug code if used poorly. Using simple utility functions to help keep your callbacks clean and error-free. Assignment: adding events (in two senses of the word!) to the calendar.
- Week three: Object orientation. Use of the "prototype" object to create classes. The many ways of doing inheritance and multiple inheritance. I will demonstrate a couple "class building" utility functions, and explain how they work. Assignment: dynamic table, with a subclass that is sortable in various ways.
- Week four: Advanced DOM / DHTML. Using absolute positioning to layer elements. Measuring, positioning, hiding and showing elements. Doing animation with "tweening" (such as ease in, bounce in, etc). Dragging elements with the mouse. Using css transitions and transforms on browsers that support it (currently Safari/Chrome, but soon Firefox and IE). Also, the rare cases where eval() and "with" blocks are useful. Assignment: TBD.
- Week five: Ajax, including cross domain Ajax using dynamic script tags and JSON. Pulling data from 3rd party sources such as Twitter and Facebook API, without any server side code. Writing cross domain widgets and bookmarklets. Touch on using Javascript to build mobile apps and browser extensions. Assignment: TBD.
- Week six: Depending on interest, we may cover: Programming the HTML Canvas element (in non-IE browsers), and image and color manipulations. Rich text (WYSIWYG) editors. Google maps API. Regular expressions. Discussion of various libraries. Also, those who have undertaken projects during the course will have a chance to demo them.