Getting Good with JavaScript - Andrew Burgess [17]
Bonus tip here: notice what I did in the last example: I called the join method right off the split method call. How's this work? Well, we know the split method returns an array. So we can call a method on that returned array immediately; we don't have to save it to a variable first. This is called chaining methods, and there's no limit to how long you can make the method chain: as long as the return value of one method has the next method in your chain, you're gold. Many JavaScript frameworks (like jQuery) take advantage of this ability.
pop / shift
These two methods remove and return one value from the array. pop gets the last item, shift gets the first item.
Example 3.25
var arr = ["cats", "dogs", "hamsters", "fish"];
console.log( arr.pop() ); // "fish"
console.log( arr.shift() ); // "cats"
console.log( arr ); // ["dogs", "hamsters"]
push / unshift
Predictably, these are the opposite of pop and shift. push adds an item to the end of the array, and unshift to the beginning.
Example 3.26
var arr = ["Beta", "Gamma"];
arr.push("Delta");
console.log(arr); // ["Beta", "Gamma", "Delta"]
arr.unshift("Alpha");
console.log(arr); // ["Alpha", "Beta", "Gamma", "Delta"]
Both return the number of items in the array after the new item is pushed in.
reverse
Just guess what it does. Yes, it returns an array with the items reversed.
Example 3.27
alert( ["Crockford", "Resig", "Zakas"].reverse() ); // "Zakas, Resig, Crockford"
slice
Sometimes you'll want to slice your array into multiple parts. This is your method. It takes two parameters: the (zero-based) index of the starting element and the index of the element after the last one you want to slice. You can leave the second parameter off to select the rest of the array. You'll get the sub-array back:
Example 3.28
alert( ["a", "b", "c", "d", "e"].slice(2, 4) ); // ["c", "d"]
alert( ["f", "g", "h", "i", "j"].slice(1) ); // ["g", "h", "i", "j"]
sort
The sort method will re-order the items in your array however you'd like. If you don't pass in any parameters, JavaScript will sort the elements alphabetically.
Example 3.29
["d", "e", "c", "a", "b"].sort(); // ["a", "b", "c", "d", "e"]
Unfortunately, it sorts numbers "alphabetically," too, which means that the array [0, 5, 10, 15, 20, 25] will be sorted to [0, 10, 15, 20, 25, 5]. Not good. Instead, you can pass a sorting function into sort. That function should take two parameters—say, a and b—which will be items from the array. Here's how it works: the sort method will pass the first and second items of the array to the function as the parameters; then it will pass the second and third items, and so on. Inside the sorting function, you must compare the two items. Then, return one of these values (assuming the first parameter is a and the second, b):
If a should come before b, return a negative number.
If a and b are equal, return 0.
If b should come before a, return a positive number.
If you're just sorting numbers, this is really easy:
Example 3.30
var arr = [5, 2, 3, 4, 1];
arr.sort(function (a, b) {
return a - b;
});
console.log(arr); // [1, 2, 3, 4, 5];
For more on sorting functions, check out this tutorial I wrote on Nettuts+ a while back.
Math functions
JavaScript also has a Math object; you can't create objects from it, like with Date, but it offers some useful mathematic functionality.
min
A helpful function that returns the lowest of the number parameters you pass in:
Example 3.31
alert( Math.min(9, 1, 4, 2) ); // 1
max
Yes, it's the opposite of min:
Example 3.32
alert( Math.max(9, 1, 4, 2) ); // 9
random
This function returns a random number between 0 and 1. What good is that? Well, you can then multiply it by 10 to get a number between 0 and 10, roughly. Anytime you need a random number, this is your tool:
Example 3.33
alert( Math.random() ); // 0.5938208589795977 (you'll probably get something else)
alert( Math.random() * 10 ); // 6.4271276677027345 (again, your mileage may