The JavaScript Diaries: Part 13/Part 2

[previous] [next]

The JavaScript Diaries: Part 13 - Array Properties and Methods

Array Methods

concat()

If you remember our section on data types and variables we learned that concatenation (kon-kat-uh-NAY-shuhn) is the means of uniting (linking together) two or more items. This permits us to join (concatenate) several items together to form sentences, commands, even entire documents. The items are not added together as in mathematics; they're joined to form an entirely new item. The Array object has a method that combines (concatenates) the elements of two or more arrays. In doing so, a new array is created.

Let's create a couple arrays and see how we can combine them using the concat() method.

var chevCar = new Array("Nova","Impala","Corvette");
var fordCar = new Array("Escort","Pinto","Taurus");
var combCar = chevCar.concat(fordCar);
alert("The variable combCar contains " + combCar);

Let's see what we did here. We created an instance of two difference arrays (chevCar and fordCar). We then declared the variable combCar and gave it the value of the elements of the fordCar array added to the chevCar array. Basically, the statement chevCar.concat(fordCar) says, reading it backward, "take the elements of the array fordCar and add them to the end of the elements of the chevCar array." The array that's linked to the concat() method (chevCar, in our example) is the one that will be first. The arrays listed in the parentheses will be added, in order, to the first one. If we wanted the elements from the fordCar array listed first, we would write it as:

var chevCar = new Array("Nova","Impala","Corvette");
var fordCar = new Array("Escort","Pinto","Taurus");
var combCar = fordCar.concat(chevCar);
alert("The variable combCar contains " + combCar);

You can also combine several arrays, if you want:

var chevCar = new Array("Nova","Impala","Corvette");
var fordCar = new Array("Escort","Pinto","Taurus");
var volksCar = new Array("Beetle","Jetta","Quantum");
var combCar = chevCar.concat(fordCar,volksCar);
alert("The variable combCar contains " + combCar);

join()

In an array each element is separate and is treated as such. Each one has its own index number. There may be times, however, when you want to combine all of the elements. That can be done using the join() method.

var chevCar = new Array("Nova","Impala","Corvette");
var chevCar2 = chevCar.join();
alert("The array chevCar contains " + chevCar2);

If the join() method is used without any parameters, then a comma is assumed and is used to separate the elements. Otherwise, a separator can be designated as a parameter. If we added a parameter, it might look like this:

var chevCar = new Array("Nova","Impala","Corvette");
var chevCar2 = chevCar.join(" | ");
alert("The array chevCar contains " + chevCar2);

You can use almost any string, e.g.,

var chevCar = new Array("Nova","Impala","Corvette");
var chevCar2 = chevCar.join(" and ");
alert("The array chevCar contains " + chevCar2);

If you used an empty parameter, e.g., chevCar.join(""), each element in the array would be joined without any type of separator. You could also use the <br> with the document.write statement to format the results in a list. That could be accomplished using a script like this:

var chevCar = new Array("Nova","Impala","Corvette");
var chevCar2 = chevCar.join("
");
document.write(chevCar2);

[previous] [next]

URL: