Prototype --- A javascript Framework

 

Recently, I read through the source code of Prototype -- a Javascript framework.  Its purpose it to extend basic Javascript language to provide more useful and  powerful functionalities which make programmers work easily. Basic extension is to simulate object-oriented programming model.

 

• Class
  Class creation:
        The only feature of classes defined this way was that the constructor called a method called initialize automatically. In other words, every time a user creates a new class by calling Class.create function, the initialize is invoked automatically. So users can put initialization code in initialize function.
  

  var Class = {
   create: function() { 
    return function() {
     this.initialize.apply(this, arguments);
  
    }
   }
  }
  

  Typical usage:
  

  var person = Class.create();
  person = {
   initialize : function( arguments ){},
   function2 : function(){},
   ...
  }
  

  
  Class inheritance:
  

  Object.extend = function(destination, source) {
   for (var property in source) {    
    destination[property] = source[property];
   }
   return destination;
  }
  

  You can see that it just copies all properties from source object to destination object.
  
  
• Ajax
  Prototype wraps basic xmlhttprequest object. It provides several useful objects: Ajax.Request, Ajax.Responders, Ajax.Updater and Ajax.PeriodicalUpdater.
  By using Ajax.Requestr, users can send requests to a destination host. By installing callback funtions, when operation succeeds or fails, corresponding function is invoked automatically.
  By using Ajax.Updater, users can associate an request with a specified html element. When requested data comes, content in that element is automatically updated.
  By using Ajax.PeriodicalUpdater, users can set the frequency and decay of executing update operations.
  
  
• JSON
  JSON - Javascript Object Notation is representation of javascript object. Of course, the javascript can be described in XML. However, parsing of JSON is faster than that of XML.
  Parse JSON
  var data = str.evalJSON(true);//where str is the string you want to be parsed.
  Encode JSON:
  Object.toJSON( dataobj );
  where dataobj is the object you want to convert to JSON. Object automatically invokes toJSON functions of different objects based on the type. So, you can write a customized toJSON function for your object.
  objname.toJSON(); where objname is the object which will be converted.
  
  
• DOM extension
  Prototype adds many convenient methods to elements returned by the $() function. For example
  $('title').addClassName('css-title').show()
  Magic? Let me reveal the secret. Prototype implements Element.extend(obj) funtion which extends the specified object by copying all those methods (addClassName ...) directly. In addition, the Element.extend function can guarantee that the same element is not extended twice.
  Or you can use following syntax:
  Element.function_name( element_name, property_value );
  Programmers can write their own element functions, encapsulate them in a an object and pass the object to Element.addMethods function.
  (Note: the element object which is passed to the new element funtions must be returned at the end).