Table of Contents
In this tutorial, I will take you through 10 Most Popular JavaScript Function Examples. Functions are essentially a small block of code which can be used to perform a task. It is of two types: System defined function and User defined functions. JavaScript has many inbuilt functions which are widely used with web programming languages. Here we will only discuss the important functions and will discuss rest of them in later tutorials.
JavaScript Function Examples
Also Read: An Introduction to JavaScript
1. toString() Method
If you want to convert number to a string, you can do that by using toString() JavaScript function as shown below.
Syntax
number.toString( [radix] )
Example
<html>
<head>
<title>Using toString method</title>
</head>
<body>
<script>
var arr = [8, 10, 45, 21];
document.write("Converting to String: " + arr.toString());
</script>
</body>
</html>
Output
Converting to String: 8,10,45,21
2. shift() method
If you want to remove element from index 0 of an array, then you can use shift() JavaScript function as shown below. It will remove value from index 0 and will move all the contents to one index down.
Syntax
array.shift()
Example
<html>
<head>
<title>Using Array shift method</title>
</head>
<body>
<script>
var arr = ["this", "is", "hi", "from", "cyberithub"];
document.write("Shifted Value: " + arr.shift());
document.write("<br />");
document.write("Array after removing first element: " + arr);
</script>
</body>
</html>
Output
Shifted Value: this Array after removing first element: is,hi,from,cyberithub
3. slice() method
If you want to extract some values from an array, you can do that by using slice() JavaScript function where you need to pass begin index number and the end index number of the array to extract the value as shown below.
Syntax
array.slice(begin,end)
Example
<html>
<head>
<title>Using Array slice method</title>
</head>
<body>
<script>
var arr = ["this", "is", "hi", "from", "cyberithub"];
document.write("Array slice from 0 to 2: " + arr.slice( 0, 2) );
document.write("<br />");
document.write("Array slice from 1 to 3: " + arr.slice( 0, 3) );
</script>
</body>
</html>
Output
Array slice from 0 to 2: this,is Array slice from 1 to 3: this,is,hi
4. reverse() method
If you want to reverse print an array, you can do that by using reverse() JavaScript function as shown below. You can see from the output that the value of array is displayed in reverse order.
Syntax
array.reverse()
Example
<html>
<head>
<title>Using reverse method</title>
</head>
<body>
<script>
var arr = ["this", "is", "from", "cyberithub"];
document.write("String after reversal: " + arr.reverse());
</script>
</body>
</html>
Output
String after reversal: cyberithub,from,is,this
5. push() method
If you want to push some values at the end of an array, you can do that by using push() JavaScript function where you need to pass the value as an argument to push() method as shown below.
Syntax
array.push(value1,value2...valueN)
Example
<html>
<head>
<title>Using push method</title>
</head>
<body>
<script>
var str = ["this", "is", "from"];
document.write("String before push: " + str);
document.write("<br />");
document.write("Push 'cyberithub': " + str.push("cyberithub"));
document.write("<br />");
document.write("String after push: " + str);
</script>
</body>
</html>
Output
String before push: this,is,from Push 'cyberithub': 4 String after push: this,is,from,cyberithub
6. match() method
If you want to match some values from a string, you can perform the match by using match() JavaScript function where you need to pass the string name as an argument to match() method as shown below. Here we are also using a simple If..Else statement to verify the match if it is available or not.
Syntax
string.match(regexp)
Example
<html>
<head>
<title>Using push method</title>
</head>
<body>
<script>
var str = "this is from cyberithub";
var found = str.match("from");
if ( found != null )
{
document.write("Found the match ");
}
else
{
document.write("Did not found the match: ");
}
</script>
</body>
</html>
Output
Found the match
7. lastIndexOf() method
If you want to find the last index no of a specified value from a string, then you need to use lastIndexOf() JavaScript function where you can pass the specified value as an argument to lastIndexOf() method as shown below.
Syntax
string.lastIndexOf(value,index)
Example
<html>
<head>
<title>Using lastIndexOf method</title>
</head>
<body>
<script>
var str = "this is from cyberithub";
document.write("Last index of 'is': " + str.lastIndexOf("is"));
</script>
</body>
</html>
Output
Last index of 'is': 5
8. charAt() method
If you want to find a value at a particular index in an array, then you need to use charAt() JavaScript function where you need to pass the index number as an argument to charAt() function and you will get the character at that particular index as you can see from the output.
Syntax
string.charAt(index)
Example
<html>
<head>
<title>Using charAt method</title>
</head>
<body>
<script>
var str = "this is from cyberithub";
document.write("Character at Index 10 is: " + str.charAt(10));
</script>
</body>
</html>
Output
Character at Index 10 is: o
9. concat() method
If you want to concatenates multiple arrays, you can do that by using concat() JavaScript function where you need to specify all the arrays which you want to concatenates. In this example, I am using only 2 arrays to concatenate as you can see from the output.
Syntax
array1.concat(array2,array3....arrayN)
Example
<html>
<head>
<title>Using concat method</title>
</head>
<body>
<script>
var str = "this is ";
var str1 = "from cyberithub";
document.write("String 1 is: " + str);
document.write("<br />");
document.write("String 2 is: " + str1);
document.write("<br />");
document.write("Joining String 1 and String 2: " + str.concat(str1));
</script>
</body>
</html>
Output
String 1 is: this is String 2 is: from cyberithub Joining String 1 and String 2: this is from cyberithub
10. search() method
If you want to search some values from a string, you can do that by using search() JavaScript function where you need to pass the value of the string to get the starting index number as shown below.
Syntax
string.search(value)
Example
<html>
<head>
<title>Using search method</title>
</head>
<body>
<script>
var str = "this is from cyberithub";
document.write("Search String 'om': " + arr.search("om"));
document.write("<br />");
document.write("Search String 'fr': " + arr.search("fr"));
document.write("<br />");
document.write("Search String 'it': " + arr.search("it"));
</script>
</body>
</html>
Output
Search String 'om': 10 Search String 'fr': 8 Search String 'it': 18
Reference: Javascript Tutorial