///Using Arrays in JavaScripts

Using Arrays in JavaScripts

Using Arrays in JavaScripts

We’ll revert back to our form processing script after having a peek at arrays. Technically, an array is a sequence of logically related data items. It’s kind of a row made of boxes, with each box holding a value. Each box can be accessed by, first box, second box, third box, and so on, till the nth box. The first box, or the lowest bound of an array is always zero – that means, the first item in an array is always at position zero of that array. A position in an array is called index. So the third item in an array would be at index 2 (0, 1, 2).

A string variable is, in reality, an array. So, if we have

var myname="Amrit";

then myname[0] has "A", myname[1] has m, and so on.

In a similar way, we can initialize every index position of an array. For instance:

var myname=new Array(5);
//In this way we declare an array.
myname[0]="A";
myname[1]="m";
myname[2]="r";
myname[3]="i";
myname[4]="t";
//It seems we have just filled till the index 4, but the dimension
//can be any number, as long as you don’t try to assign
//a value to an index that does not exist.

//The following for(){…} loop displays the array.

for(n=0; n<5; n++)
{

document.write myname[n];

}

The above mentioned is a one-dimensional array. We can also have multi-dimensional arrays. At this moment, we’ll be only covering till two-dimensional arrays because we have just begun to explore arrays.

To explain multi-dimensional array, let’s view this example:

var cities=new Array(10);
cities[0]="Mumbai";
cities[1]="Hyderabad";
cities[2]="Delhi";
cities[3]="Pune";
cities[4]="Varnasi";
cities[5]="Ludhiana";

This is a two-dimensional array, as it goes from down to up as well as from left to right. That is, cities[2][3] would give us "h" of Delhi.

Hence we come back to form.elements[ ] from the previous section. This is an array of all the elements of the form we used the last time.

To refresh our memory, the form performed the following functions:

  1. Don’t allow a blank field
  2. In the Name field, don’t accept numerical entries
  3. The Email should contain the character "@"

The main function, checkfields(), first checks if there are any blank fields.

var AllFilled=true;
for(i=0; i<3; i++)
{

if(visitor.elements[i].value.length==0)
{

alert("The field [" + visitor.elements[i].name + "] can not be left blank.");
AllFilled=false;
visitor.elements[i].focus;
return;

}

}

In this portion, we assume initially that all the fields are filled (AllFilled=true). Then, within the loop, we check the length of each value of every element. If the length of a field value is found to be 0, AllFilled is set to false, and the function returns. We use return even when we want to stop using a function pre-maturely.

if(AllFilled==true)
{

var NameValid=true;
var EmailValid=true;
NameValid=CheckName(visitor.vname.value);
EmailValid=CheckMail(visitor.vemail.value);

if(NameValid==false)
{

alert("Sorry, your name can not contain numbers.");
visitor.vname.focus;

}

if(EmailValid==false)
{

alert("Sorry, this does not seem like a valid email address.");

}

}

if(NameValid==true & EmailValid==true)
{

alert("RIGHTO!!!");

}

}

After making sure that all the fields have been filled [if AllFilled==true], we check for their validity. First, the function CheckName() is used. The value of the Name field is sent to it to check whether there are numerical values in there. Consider CheckName():

function CheckName(HoldName)
{

NoNumThere=true;

for(i=0; i<HoldName.length; i++)
{

for(j=0; j<10; j++)
{

if(HoldName.charAt(i)==j.toString())
{

NoNumThere=false;
break;

}

}

if(NoNumThere==false)
{

break;

}

}

return NoNumThere;

}

In the beginning, we assume there is no number, so we initialize a variable, NoNumThere to true. There are nested for(){…} loop here. The first is the father loop, and the second is the child loop. As I mentioned a while ago, even a string is an array. So the father loop starts from the value in zero position, compares it to 0 through 9 [using the child loop]. Since a string character can only be compared to a string character [we can check if "A" =0, but we can check if "A"="0", where zero is a string character now.], in the child loop, what

if(HoldName.charAt(i)==j.toString())
{

NoNumThere=false;
break;

}

does is, it uses the value of i obtained from the father loop to extract the character from position i. Then it compares that value with the string version of whatever value j [from 0 to 9] is holding at that moment, and if a match is found, NoNumThere is set to false, and the child loop is broken. Once the child loop is broken without j reaching 9, the father loop gets to check the value of NoNumThere. If NoNumThere is ‘false’, then there is no point in carrying out the rest of the loop. The father loop is broken too, and the value of NoNumThere is returned to the calling procedure, which was,

NameValid=CheckName(visitor.vname.value);

So when a numeric match is found, NameValid has a false value, and hence, an error.

Similarly, EmailValid holds the result from CheckEmail(), which is a very easy function to follow using the preceding explanation.

2010-05-26T11:00:06+00:00 June 1st, 2005|JavaScript|0 Comments

About the Author:

Amrit Hallan is a freelance web developer. You can checkout his website at http://www.bytesworth.com. For more such articles join BYTESWORTH REACHOUT at http://www.bytesworth.com/br/default.asp or if you have a web dev related question then post it at http://www.business180.com/index.php

Leave A Comment