Find numbers using JavaScript RegExp-HTML Tutorial-php.cn

Find numbers using JavaScript RegExp

WBOY

Release： 2023-09-04 19:01:14

forward

1349 people have browsed it

使用JavaScript RegExp查找数字

In this tutorial, we will learn how to find numbers (0-9) using JavaScript RegExp. ASCII values for numbers [0-9] start from 48 to 57. If you want to print any ASCII value of a number, you need to add 48 to the number.

We represent numbers in regular expressions as \d. RegExp is an object that specifies a pattern for performing search and replace operations or input validation on strings.

grammar

The following is the syntax of the regular expression pattern for numbers or \d characters -

new RegExp("\d") or simply /\d/

Copy after login

/\d/ was introduced in ES1. It is fully supported by all browsers. Such as Chrome, IE, Safari, Opera, Firefox and Edge.

RegExp has modifiers such as g, i, m. "g" is used to perform a global match, "i" is used to perform a case-insensitive match, and "m" is used to perform a multi-line match.

Syntax

The syntax for \d with a modifier like,

new RegExp("\d", "g") or simply /\d/g

Copy after login

algorithm

Step 1 - Define a string containing some numbers.
Step 2 - Define the RegExp pattern for numbers.
Step 3 - Apply match(pattern) to the string defined above to find numbers in the string.
Step 4 - Display results - numbers.

Let's see some program examples for a clearer understanding.

Example 1

In the following program, we use string matching (pattern) to find numbers (\d) in a given string. We use the RegExp pattern as /\d/g. The string match() method returns an array of numbers in a string.

<!DOCTYPE html>
<html>
<body>
   <h2>RegExp digit finding</h2>
   <p id="text"> </p>
   <p>Digit(s):
   <span id = "result"></span>
   </p>
   <script>
      let text = "200 students are passed out 250 in the class.";
      document.getElementById("text").innerHTML = text;
      let pattern = /\d/g;
      let result = text.match(pattern);
      document.getElementById("result").innerHTML = result;
   </script>
</body>
</html>

Copy after login

Here, if there are numbers in the given text, the match() method will return an array of numbers, otherwise it will return null. Let's look at another example.

Example 2

In the following program, we get a string without numbers and try to find numbers in the string. We use string matching (pattern) to find numbers (\d) in a given string. We use the RegExp pattern as /\d/g. Let's see what our output looks like.

<!DOCTYPE html>
<html>
<body>
   <h2>Finding digits using RegExp</h2>
   <p id = "result"></p>
   <script>
      let text = "All students are qualified for the test";
      let pattern = /\d/g;
      let result = text.match(pattern);
      if(result == null){
         document.getElementById("result").innerHTML = "No digits found in the text.";
      } else {
         document.getElementById("result").innerHTML = result;
      }
   </script>
</body>
</html>

Copy after login

Example 3

In the program below, we search for numbers between 2 and 7. To do this, we use /[2-7]/g as the regular expression pattern.

<!DOCTYPE html>
<html>
<body>
   <h2>RegExp digit finding</h2>
   <p id = "text"></p>
   <p>Digit(s):
   <span id = "result"></span>
   </p>
   <script>
      let myStr = "200 students are passed out 250 in the class.";
      document.getElementById("text").innerHTML = myStr;
      let pattern = /[2-7]/g;
      let result = myStr.match(pattern);
      document.getElementById("result").innerHTML = result;
   </script>
</body>
</html>

Copy after login

We can use some methods to replace numeric characters. Let’s see the following example

Example 4

Find and replace numbers

In the example below, we find numbers and replace them with space characters. For this we use split() and join() methods.

<!DOCTYPE html>
<html>
<body>
   <h2>Replace digit character(s)</h2>
   <p id = "text"></p>
   <p>After replacing the digit character(s):
   <span id = "result"></span>
   </p>
   <script>
      let myStr = "200 students are passed out 250 in the class.";
      document.getElementById("text").innerHTML = myStr;
      let pattern = /\d/g;
      let result = myStr.split(/\d/g).join(" ")
      document.getElementById("result").innerHTML = result;
   </script>
</body>
</html>

Copy after login

Example 5

We will also check for an easier way to replace numeric characters. Like,

<!DOCTYPE html>
<html>
<body>
   <h2>Replace digit character</h2>
   <p id = "text"></p>
   <p>After replacing the digit character(s):
   <span id = "result"></span>
   </p>
   <script>
      let myStr = "200 students are passed out 250 in the class.";
      document.getElementById("text").innerHTML = myStr;
      let pattern = /\d/g;
      let result = myStr.replace(/\d/g , " ")
      document.getElementById("result").innerHTML = result;
   </script>
</body>
</html>

Copy after login

As we discussed, g stands for global match. It doesn't stop on the first occurrence, but looks for all occurrences.

Here, we can observe that there are no numbers in the text. Therefore, match() will return null. Hopefully this tutorial clarified how to find numbers in given text.

The above is the detailed content of Find numbers using JavaScript RegExp. For more information, please follow other related articles on the PHP Chinese website!