Understanding some of the basic built-in javascript array methods
This blog gives a brief overview of the basic javascript methods that are related to arrays.
1. concat()
This methods joins two arrays and outputs a new array
<script type="text/javascript">
//concat()
var arr1 = [1, 2, 3];
var arr2 = [4, 5, 6];
var resultarr = arr1.concat(arr2);
document.write(resultarr); //Output will be 1,2,3,4,5,6
</script>
2. filter()
This method is used to filter out an array based on some functions. The output will be an array with elements from parent array which satisfies the condition.
<script type="text/javascript">
//filter()
var arr1 = ["1", "a", "b", "2", "3"];
var resultarr = arr1.filter(checkifnumber); //Here we call a function to check whether element is number or not
document.write(resultarr); //Output will be 1,2,3
function checkifnumber(element, index, array) {
return (!isNaN(parseFloat(element)));
}
</script>
3. indexOf()
This method returns the index of the first occurance of an particular element in an array. If element not found in the array, then returns -1.
<script type="text/javascript">
//indexOf()
var arr1 = ["1", "a", "b", "2", "3", "b"];
document.write(arr1.indexOf("b")); //Output will be 2
</script>
4. lastIndexOf()
This method returns the index of the last occurance of an particular element in an array. If element not found in the array, then returns -1.
<script type="text/javascript">
//lastIndexOf()
var arr1 = ["1", "a", "b", "2", "3", "b"];
document.write(arr1.lastIndexOf("b")); //Output will be 5
</script>
5. join()
This method joins elements of an array into a string. We can pass a separator as an parameter to join method.
<script type="text/javascript">
//join()
var arr1 = ["This", "is", "a", "example", "of", "array", "join"];
document.write(arr1.join(" ")); //Output will be "This is a example of array join"
document.write(arr1.join("-")); //Output will be "This-is-a-example-of-array-join"
</script>
6. reverse()
This method reverses teh order of elements in the array.
<script type="text/javascript">
//reverse()
var arr1 = ["a", "b", "c", "d", "e", "f", "g"];
var resultarr = arr1.reverse(); // It will be ["g", "f", "e", "d", "c", "b", "a"]
document.write(resultarr); //Output will be g,f,e,d,c,b,a
</script>
7. slice()
This method extracts a given number of elements from an array and returns a new array. We can pass begin & end (not included in reulting array) index of elements to be extracted as parameters.
<script type="text/javascript">
//slice()
var arr1 = ["a", "b", "c", "d", "e", "f", "g"];
var resultarr1 = arr1.slice(1, 3); // It will be ["b", "c"]
var resultarr2 = arr1.slice(3, 6); // It will be ["d", "e", "f"]
</script>
8. sort()
This method sorts the elements of an array in an alphabetical order.
<script type="text/javascript">
//sort()
var arr1 = ["red", "blue", "white", "green"];
var resultarr1 = arr1.sort(); // It will be ["blue", "green", "red", "white"]
var arr2 = [5, 27, 16, 8];
var resultarr2 = arr2.sort(3, 6); // It will be [16, 27, 5, 8]
</script>
Here in the above script, we can find that the numerical array is also sorted in alphabetic order. Inorder to sort it in numerical order, we can wreite a custom function and call it inside our sort function as below.
<script type="text/javascript">
//sort()
var arr1 = [5, 27, 16, 8];
var resultarr1 = arr1.sort(sortNumber); // It will be [5, 8, 16, 27]
function sortNumber(num1, num2) {
return num1 - num2;
}
</script>
Hope this will be helpful!
