Prototype.js Power

I wasn't really sure that my implementation of it would be what really took off, but fortunately I was able to get a prototype done. - Shawn Fanning

Introduction

In my upcoming article on the development of a Mac OS X widget for Aim Fight! - (Now read the complete article!) I utilized the Prototype JavaScript Framework for my development. If you're experienced with Ruby on Rails, you'll already be familiar with the Prototype Javascript Framework. If you haven't been using RoR, and you're developing AJAX applications, you may want to become more familiar with the Prototype Framework. The prototype.js libraries, developed by Sam Stephenson evolved out of the Ruby on Rails project, and has become a project on it's own. Providing a number of useful functions, it has become a core foundation of many AJAX frameworks.

Functions

One of the most widely used, and useful, functions provided by the Prototype library is the $ function. That's right $ is actually a valid identifier in JavaScript! Prototype redefines $ to replace the painful document.getElemenetById() method that JavaScript programmers have been wearing out their keyboards over for years. Instead of this:

var x = document.getElementById('myControl');

you can now simply use this:

var x = $('myControl');

The benefit? Much cleaner and easy to read code. So useful, that I believe overtime it will make its way into the official JavaScript language.

Other useful functions include:

• $$ - Takes an arbitrary number of CSS selectors (strings) and returns a document-order array of extended DOM elements that match any of them. For example $$('div') returns an array of all the divs contained in the document.
• $F - Returns the value of a form control - replaces Form.Element.getValue
• $A - Accepts an array-like collection (anything with numeric indices) and returns its equivalent as an actual Array object. This method is a convenience alias of Array.from, but is the preferred way of casting to an Array.
• $w - Splits a string into an array, treating whitespace as delimiters.

More...

Prototype.js provides so much more than just a few functions: it extends the JavaScript Document object Model (DOM); provides essential tools for handling AJAX communications; provides a number of new and useful objects; and much more. Prototype has also been used to build a number of useful JavaScript libraries.

Here are a few links to help you get started with Prototype:

• Prototype JavaScript Framework - http://www.prototypejs.org/
• Prototype JavaScript Documentation - http://beta.bigmedium.com/projects/prototype-pdf/
• Developer Notes for Protoype.js - http://www.sergiopereira.com/articles/prototype.js.html

While I've found the Prototype JavaScript Framework useful - it not without controversy - some examples can be found here and here. Have you used the Prototype Framework? Let's hear your opinion!