Question

I’m using jQuery validate plugin, and when I met the following script, i recognize, that i don’t understand many things in jQuery:)

Look please

$("#invitationform").validate({
        rules: 
        {
            phone: 

• List item

          {
              required: true,
              minlength: 6,
              number:true
          }
      },
      messages: 
      {
          phone: 
          {
              required: "Please enter a phone number",
              minlength: "Your number must consist of at least 6 digits"
          }
      }
  });
  

Please help me to understand who are “rules”, and “phone” here? Are they something like list elements, or they are variables of the object? And why we call them via : ?

Short explanation, or links on some documentation will be very nice.

Thanks much

Answer 1

Apart from the few primitive types (numbers, strings, booleans, null and undefined) everything is an object in JavaScript (even functions).

Objects are basically containers of properties, which happen to be very useful for collecting and organizing data.

One popular method to create objects is to use the object literal notation, where the property name is separated from the value by the colon : symbol:

var myFirstObject = {
   'name': 'Bobby',
   'surname': 'Smith'
};

The quotes around property names are optional if the name would be a legal JavaScript identifier and not a reserved word. A property’s name can be any string. Objects can contain other objects, so they can easily represent trees or graphs:

var myFlight = {
   'airline': 'Airline Name',
   'number': 'AN700',
   'departure': {
      'IATA': 'SYD',
      'time': '2010-09-04 23:10:00'
   },
   'arrival': {
      'IATA': 'LAX',
      'time': '2010-09-05 05:14:00'
   }      
};

JavaScript objects also happen to be a convenient hash table data structure. You could easily do the following:

var myHashTable = {};
myHashTable['name'] = 'Bobby';
myHashTable['surname'] = 'Smith';
// subscript notation:
alert(myHashTable['name'] + ' ' + myHashTable['surname']);
// dot notation: (equivalent)
alert(myHashTable.name + ' ' + myHashTable.surname);

jQuery, and many other JavaScript libraries, often expect an object as an argument to a method. To give you an example from another library, this is how a map is constructed using the Google Maps API v3:

var map = new google.maps.Map(document.getElementById('map'), { 
   mapTypeId: google.maps.MapTypeId.ROADMAP,
   center: new google.maps.LatLng(39.904667, 116.408198),
   zoom: 12
});

Note how we can easily pass readable complex structures as function arguments because of how JavaScript works.