PHP-Fusion Powered Website

Introduction to JavaScript search

You all know the meaning of ‘search’, what we do daily with our phones 24*7 is searching or browsing. We search by giving some part of the word and Google automatically gives us some suggestions. So here we will be implementing the simple search using JavaScript. search() is a JavaScript in built method. JavaScript search method executes or performs a search for a match between the string Object and the Regular Expression. search() method searches string of a specific value, which returns the position of the matching string.

Syntax:

string.search(search_value);

Parameters search_value is required regular expression. String gets automatically converted to a regular expression.
Return value is a number which represents the position of first occurrence of specific value, else returns -1 if no match is found.
If any non Regex Expression is passed as search_value, it gets converted to Regular Expression itself.
Index start at 0 and if the first attempt, alphabet gets matched, search() method does not proceed for further check and simply returns the first alphabet index.
search() method is used to know when a pattern is found and knows its index of the string.

Examples of JavaScript search

Given below are the examples of JavaScript search:

Example #1

To find the index of regular expression in string.

Code:

<!DOCTYPE html>
<html>
<body>
<h2>Using JavaScript Search method to find the index of a string</h2>
<p id="demo"></p>
<script>
var sampleString = "Google Browser";
var regexString1 = /o/;
var regexString2 = /B/;
var regexString3 = /e/;
document.write("o found at index " + sampleString.search(regexString1) + "<br>");
document.write("B found at index " + sampleString.search(regexString2) + "<br>");
document.write("e found at index " + sampleString.search(regexString3));
</script>
</body>
</html>

Output:

sampleString.search() searches for ‘o’, ‘B’, ‘e’ in string ‘Google Browser’ and prints the index numbers.

Example #2

To find the index of a word in the complete string.

Code:

<!DOCTYPE html>
<html>
<body>
<h2>Using JavaScript Search method to find the index of a searched string</h2>
<p id="demo"></p>
<script>
var stringSample = "eduCBA is a learning website which has various Software development courses";
var regexMatch = stringSample.search("website");
document.write("String searched for is found at index ", regexMatch);
</script>
</body>
</html>

Output:

stringSample.search(“website”) is found at 21st index.

Example #3

To perform case insensitive search.

Code:

<!DOCTYPE html>
<html>
<body>
<h2>Using JavaScript Search method to find the index of a case insensitive search</h2>
<p id="demo"></p>
<script>
var stringSample = "eduCBA has JavaScript Website Development Course which is different from any other website";
var regexMatch = stringSample.search(/website/i);
document.write("String searched for is found at index ", regexMatch);
</script>
</body>
</html>

Output:

.search() method performs a case insensitive search. Index is for the first occurrence of the string ‘website’.

Example #4

Code:

<!DOCTYPE html>
<html>
<body>
<h2>Using JavaScript Search method to find the index of regular expression </h2>
<p id="demo"></p>
<script>
var stringSample = "eduCBA has JavaScript Website Development Course which is different from any other website";
var regexMatch = stringSample.search(/[A-Z]/g);
var regexMatch1 = stringSample.search(/[,]/g);
document.write("String searched for is found at index ", regexMatch + "<br/>");
document.write("String searched for is found at index ", regexMatch1);
</script>
</body>
</html>

Output:

-1 represent that the string searched for is not found.

Example #5

Code:

<!DOCTYPE html>
<html>
<body>
<h2>Using JavaScript Search method to find the index of regular expression </h2>
<p id="demo"></p>
<script>
var stringSample = "English storybooks for children on StoryWeaver, Are they Useful?";
var regexMatch = stringSample.search(/[^\w\s]/g);
var regexMatch1 = stringSample.search("U");
document.write("Regex match found at index ", regexMatch + "<br/>");
document.write("Regex match found at index ", regexMatch1);
</script>
</body>
</html>

Output:

We have different types of regex expressions, you need to deep dive into it to know better.

It can either be a string value or a RegExp object for searching in string. RegExp can be a combination of string and regular expressions.

$ matches end of string.
^ matches start of a string.
*Matches zero or more number of expressions.
. matches any expression except NULL.
\b matches boundary of a word.
\w matches a character word.

If search_value is not found in string, it will return -1. search method performs a case sensitive search. search method does not consider \g in the regular expression as .search() cannot perform global match, only finds first match and gives the index number. The simplest way to search for a string is without using regular expression.

Conclusion

With this, we come to a conclusion of our topic ‘JavaScript search’. We have seen its definition and its syntax. Illustrated few examples of implementing JavaScript search() method. If match is found, the index of the string is printed in the console. And if not match is found, console prints -1. Both string and regular expression can be given as a match to find in the string. Also see some of the Regex used to search the word.