Sign In/My Account | View Cart  
advertisement


Listen Print Discuss

Prototype: Easing AJAX's Pain
by Bruce Perry | Pages: 1, 2, 3, 4

Delegator

Our own CO2Levels object uses the concept of delegation, wherein calls to its own keys(), values(), and add() methods delegate the real work of these operations to the internal Hash object. This object is stored as a local variable: levelsHash.

Let's look at the getYear() method.

getYear: function(year){
    if (! isNaN(year)) {
        return this.levelsHash[year];
    }   else {
        return 377;
    }
}

The built-in JavaScript method isNaN() returns false if its parameter can be evaluated as a number (such as "2000"), and true otherwise (as in isNaN("hello")). If the getYear() parameter passes this test, then the code uses a common JavaScript expression to return the value of a key or property: this.levelsHash[year] (for example, this.levelsHash["2004"] evaluates to 377.38). The browser then displays this numerical value inside the HTML div element.

Add Stuff to an Existing Hash

The CO2Levels object has an add() method, which can add new keys and values (additional years and CO2 levels) to the existing data.

add: function(year,level){
    var tmp = new Object();
    tmp[year] = level;
    this.levelsHash=this.levelsHash.merge(tmp);
}

This method creates a new Object from its two parameters (representing the year and CO2 level), which might look like: {"2005":381}

The code then passes this object to the Prototype Hash object's merge() method. This method combines the new object with the Hash's existing data, essentially merging them into one group of data or associative array.

The merge() method returns the existing data with the new property/value pair(s) appended to the end.

With some refactoring, the code could use XMLHttpRequest to fetch any new levels from the Mauna Loa Observatory, then add them to our existing client-side data.

Inspect

Finally, Prototype's Hash object also has an inspect() method. This method creates a readable display of the Hash's contents, as in Figure 1-3.

alert window shwing hash contents
Figure 1-3. Looking inside a Hash

The CO2Levels object delegates the task of its own inspect() method to its internal Prototype Hash object.

inspect: function(){
    alert( this.levelsHash.inspect());
}

This is a useful debugging tool for viewing the current contents of a Hash object.

An upcoming article discusses an AJAX caching strategy used with the same application. It introduces Prototype's Ajax.Request object, which reduces the amount of code that has to be devoted to using the XMLHttpRequest object. This is the important top-level JavaScript object used in AJAX applications for making HTTP connections with a server behind the scenes.


Comment on this articleShare your experience in our forums.
(* You must be a
member of XML.com to use this feature.)
Comment on this Article


Titles Only Titles Only Newest First
  • Why Prototype?
    2006-12-15 17:20:42 magnets [Reply]

    I simply do not understand why anyone would want to use Prototype. There is close to 1800 lines of javascript code in Prototype. I've written entire AJAX ecommerce websites with less javascript code.


    Basically use the object and store the result using innerHTML. What could be more simple?


    You don't even need acceptance of an Open Source license since it is just your own Javascript.


    There is an example at httpcssphp.com but that is even more complex than my code.

  • How do I add private methods?
    2006-11-22 06:36:01 Raphael.Stolt [Reply]

    I am still in the dark on how I define method to/in an private scope?


    I tried to play around with the following source but couldn't get to work.


    Any hint or better a solution would be appreciated and solve for me another part in the javascript 'puzzle'.


    var Headline = Class.create();
    Headline.prototype = {


    initialize: function() {
    this.responseText = '';
    this.isAtttachedUploadRemoved = false;

    },
    getResponseText: function () {
    if(this.isAttachedUploadRemoved) {
    return this.responseText;
    }
    },
    removeAttachedUpload: function(uploadId, headlineId) {
    alert('Call to remove method with '+ uploadId + ' ' + headlineId);
    this.setAttachedUploadRemoveStatus(true);
    this.responseText = 'blah 2006';
    },

    /** this method should be private
    * so I can make private calls i.e. in the removeAttachedUpload method and not from the
    * outer scope
    */
    setAttachedUploadRemoveStatus: function (status) {
    this.isAtttachedUploadRemoved = status;
    }
    }

    • How do I add private methods?
      2006-11-22 08:58:26 bwp [Reply]

      See this really good article on mimicking private access specifiers in JavaScript:


      http://www.crockford.com/javascript/private.html


      Cheers.

  • why the Hash object?
    2006-04-26 11:44:06 schvenk [Reply]

    Is there any advantage to the Prototype Hash object beyond the keys, values, and inspect methods? Hashing is inherent in basic JS objects...wouldn't using something like Hash incur unnecessary overhead?

    • why the Hash object?
      2006-04-27 06:10:54 bwp [Reply]

      Prototype's Hash object also has convenient merge() and toQueryString() methods. This article shows the merge() method. Here's a link to an excellent reference to the Hash object:


      http://www.sergiopereira.com/articles/prototype.js.html#Reference.Hash


      You can pass a JS object as a parameter to the $H() Prototype method; the return value is one of these hash objects. At the very least, Prototype saves the development/debugging time associated with creating your own hash utility object.





  • 2006-04-11 10:59:13 jjones3535 [Reply]



  • New innovations make these primitive libraries obsolete
    2006-04-11 09:39:54 saym [Reply]

    Check out the process to “Loosely Couple” GUI Components build online applications:
    http://cbsdf.com/technologies/misc-docs/CF-LC-Figures.htm


    Sample GUI components and component hierarchies:
    http://cbsdf.com/technologies/demo-links/demo-links.htm


    Wish to create your own components:
    http://cbsdf.com/technologies/GUI-class1.htm


    A sample Airplane GUI component:
    http://cbsdf.com/technologies/GUI-class3.htm


    A sample application:
    http://www.cbsdf.com/technologies/jsp/atc_test1a.jsp




    • New innovations make these primitive libraries obsolete
      2006-06-20 21:53:55 mohanrao_gs [Reply]

      Guys Be Informed..


      Cbsdf.com is back with a new Ajax FRAUD !!!


      I am unable to understand what Raju and cbsdf guys
      are trying this time.But few years back these guys
      frauded (rigged) the XML-J 2002 awards and stole
      it from OpenOffice, ( Cocoon and Batik as well).
      Back then the company name was Elansoft and
      product was Agileblox
      http://marc.theaimsgroup.com/?l=xml-cocoon-users&m=104875540622555&w=2


      The below is an old google cached page
      http://66.102.7.104/search?q=cache:fdWESVpaqC8J:weblog.halogenlabs.com/%3Fp%3D86+Elansoft+cocoon&hl=en&gl=in&ct=clnk&cd=1&client=firefox-a


      For this and other business malpractices and
      sleaze, a complaint was lodged with FBI and
      Elansoft closed US office and ran from the law.


      http://forum.java.sun.com/thread.jspa?forumID=45&threadID=182966
      http://www.zdnetasia.com/builder/program/dev/talkback.htm?PROCESS=show&ID=20024225&AT=39062710-39000408_39000406_39000407_39000409_39000410_39000412_39000411_39000413_39000404_39000400_39000402_39000401_39000403_39000405c


      I feel, since they escaped FBI last time so
      easily, they are trying to do it once again

      • New innovations make these primitive libraries obsolete
        2006-08-30 20:54:32 chiluvuri1 [Reply]

        Today I found this above allegation and please let me respond. The Mohan is an incompetent Crook. He is a coward using alias name. This guy cannot compete with our innovative technology, resort to illegal methods.



        Mohan, we have invented next generation technologies:
        http://www.cbsdf.com/ep.htm (http://www.cbsdf.com/ep.htm) .

        If you are competent, just prove our technology wrong:

        http://www.cbsdf.com/misc_docs/Can-u-prove.htm (http://www.cbsdf.com/misc_docs/Can-u-prove.htm) .



        Just because my name is Raju and Elansoft’s CEO name is also Raju, he finds a connection. Names such as Raju or Reddy are quite common in India. Millions of people have these names. If one John commits murder, this stupid guy blames that on his nice neighbor John, because this crook’s wife finds him nice, attractive and successful. This kind of crocked tactics show what kind of jerk he is.



        This alleged incidence happened in Sep’2000. Due to disputes, I have left Elansoft in Sep’2001, a full year before alleged incident and not spoken to the Elansoft management ever since. If you are not a crock, provide any evidence contradicting this. You are a coward, but I will track you and I take legal action against you for the criminal acts.




    • New innovations make these primitive libraries obsolete
      2006-06-20 21:52:21 mohanrao_gs [Reply]

      Guys Be Informed..


      Cbsdf.com is back with a new Ajax FRAUD !!!


      I am unable to understand what Raju and cbsdf guys are trying this time.But few years back these guys frauded (rigged) the XML-J 2002 awards and stole it from OpenOffice, ( Cocoon and Batik as well).


      Back then the company name was Elansoft and product was Agileblox


      http://marc.theaimsgroup.com/?l=xml-cocoon-users&m=104875540622555&w=2


      The below is an old google cached page
      http://66.102.7.104/search?q=cache:fdWESVpaqC8J:weblog.halogenlabs.com/%3Fp%3D86+Elansoft+cocoon&hl=en&gl=in&ct=clnk&cd=1&client=firefox-a


      For this and other business malpractices and sleaze, a complaint was lodged with FBI and Elansoft closed US office and ran from the law.


      http://forum.java.sun.com/thread.jspa?forumID=45&threadID=182966


      http://www.zdnetasia.com/builder/program/dev/talkback.htm?PROCESS=show&ID=20024225&AT=39062710-39000408_39000406_39000407_39000409_39000410_39000412_39000411_39000413_39000404_39000400_39000402_39000401_39000403_39000405c


      I feel, since they escaped FBI last time so easily, they are trying to do it once again