Explain regular expressions in JavaScript

Play games with dreams 2021-05-04 10:49:38
explain regular expressions javascript


In practice ,JavaScript Regular expressions are often used . So this part of knowledge is very important .

One 、 Basic grammar :

The first one is : Literal grammar

var expression=/pattern/flags;

The second kind :RegExp Constructor Syntax

var pattern = /\w/gi; // Literal grammar
var pattern = new RegExp('\\w', 'gi');// Constructor Syntax , The two are equivalent

Here's a caveat : If regular expressions are dynamic , You can only choose the second .
Among them flags Yes 3 A sign
g: Represent global mode , That is, the pattern will be applied to all strings , Instead of stopping immediately when the first match is found ;
i: Indicates case insensitive mode , That is, ignore the case of pattern and string when determining the match ;
m: For multiline mode , That is, when you reach the end of a line of text, you will continue to find whether there is an item matching the pattern in the next line .
Of course, there are other flags, Very little is used , Don't elaborate too much .
As for the above \w What do you mean , wait a moment , Please read on .

Two 、 Method

There are mainly test(),search(),match(),replace(). Of course, there are many other ways , No elaboration , After all, it's rarely used .
1、test() Use of methods
Determine whether a string contains the corresponding string
2、search() Use of methods
Search the index position where the corresponding string first appears , If not found , Then return to -1
3、match() Use of methods
Return matching array
4、replace() Use of methods , This is very much used
Match the corresponding string , Then replace it with another string

3、 ... and 、 Matching expressions with actual combat

1、 Assertion :
The so-called assertion , It means that a match occurs under certain conditions . In a word? , It's a bit of a concept , Look directly at the following . I'll take my time .

character describe
^ Match the beginning
$ Match the end
\b Match the boundaries of words
\B Match non word boundaries

for instance
I want to match a string , From the beginning to the end is dog, Ignore case

var pattern = /^dog$/i;// Ignore case
console.log(pattern.test('dog'));//true
console.log(pattern.test('sdfdog'));//false
console.log(pattern.test('dog56'));//false
console.log(pattern.test('dOG'));//true
var pattern = /\b\w+/g;// The global matching , there +, It's a quantifier , representative 1 Times or more
console.log('Hello World'.match(pattern));// Output ['Hello','World'], Here is the match usage , Return matching array .

ad locum , Under the said ,\b It's the boundary of matching words , that \B It's matching the boundaries of non words . A lowercase , A capital , Capital is antonym . Then I don't have to say more .
Let's talk about word boundaries , Maybe a lot of people don't know the word boundaries very well

Let me explain a little bit , for instance ,Hello World There are four word boundaries , Namely H Location ,o Location ,W Location ,d Location
2、 Character class :

Metacharacters describe
. Find single character , Except for line breaks and line terminators
\w Find word characters , amount to [A-Za-z0-9_]
\W Find non word characters , amount to [^A-Za-z0-9_]
The following antonyms are no longer listed .
\d Find number , amount to [0-9]
\s Look for blank characters
\0 lookup NULL character
\n Find line breaks
\f Look for page breaks
\r Find the carriage return
\t Look for tabs
\v Find vertical tabs

3、 Range :

character describe
[abc] matching a,b,c Any character in
[^abc] Matching is not a,b,c Any character in
[0-9] matching 0-9 Any range of numbers , Empathy [a-z] matching a-z Any range of characters
[a-z] matching a To z Any character between
x|y matching x perhaps y

4、 quantifiers :

character describe
n+ Match anything that contains at least one character n String
n* Match any containing zero or more n String
n? Match anything that contains zero or one n String
n{x} Matching inclusion x individual n String
n{x,y} Match the least x individual , most y individual n String

Four 、 expand

matching 10-36 Number between

var pattern = /1[2-9]|[2-3][0-9]|4[0-6]/;//12-46
console.log(pattern.test(11));//false
console.log(pattern.test(12));//true
console.log(pattern.test(20));//true
console.log(pattern.test(36));//true
console.log(pattern.test(46));//true
console.log(pattern.test(47));//false

take 'Hello,World!Hello' Medium Hello Replace with Welcome

Here is to emphasize replace Methods used in regularization , Because this is very much used in practice . hinder flags Medium g, There is a big difference between adding and not adding .

var pattern = /Hello/g;
var oldString = 'Hello,World!Hello';
var newString = oldString.replace(pattern, 'Welcome');
console.log(newString);//Welcome,World!Welcome

版权声明
本文为[Play games with dreams]所创,转载请带上原文链接,感谢
https://qdmana.com/2021/05/20210504104735706G.html

  1. css单位
  2. CSS unit
  3. 前端验证集合
  4. Front end validation collection
  5. Front end learning (4) -- response line, response head, response body
  6. Lesson 27: using time measuring tools to explore available spare time
  7. CSS 单位
  8. CSS unit
  9. 前端工具集合
  10. Front end Tools Collection
  11. Introduction to HTTP message format
  12. Introduction to light application embedded development with JavaScript
  13. Vue入门常用指令
  14. Introduction to new features of HTML5
  15. Common instructions for Vue
  16. Introduction of bootstrap Blazer component library
  17. HTML5 速览
  18. HTML5 quick view
  19. HTML表格自动排序
  20. For less than $1700, create a private cloud with openstack
  21. Basic learning of JavaScript (1)
  22. 前端编程之路一一HTML标签分类
  23. Front end Programming: HTML tag classification
  24. ColSpan and rowspan merging cells of HTML form elements
  25. JavaScript 日期时间格式化
  26. JavaScript date time formatting
  27. Classification of front end interview questions - html2
  28. HTML learning
  29. CSS块元素
  30. CSS block elements
  31. Summary of HTML5 knowledge points (5)
  32. HTML5 form detailed tutorial
  33. HTML5 form detailed tutorial
  34. HTML5新增的元素表
  35. New element table in HTML5
  36. 3D轮播插件vue-carousel-3d非官方最全文档
  37. 3D carousel plug-in vue-carousel-3d
  38. Uniapp (Vue general) integrates Tencent location service SDK -- multi platform small program general
  39. Slowhttptest slow attack tool use details
  40. Xi Da Pu Ben, wechat finally supports the opening of small programs on the Internet!
  41. HTML summary (2)
  42. css3总概
  43. Overview of CSS3
  44. Front end abnormal monitoring system
  45. 免费网站部署和免费数据库Serverless云存储资源汇总整理
  46. Free website deployment and collection of free database serverless cloud storage resources
  47. Vux form -- a form solution of base vux
  48. 可以直接用于HTML中的特殊字符表 unicode字符集
  49. Can be directly used in HTML special character table Unicode character set
  50. Detailed explanation of HTTP protocol
  51. HTTP request header and request response header
  52. CSS background深度解析
  53. Research on front end exception monitoring solution Tencent CDC
  54. Python web/HTML GUI
  55. Front end standard 2: HTML you know and don't know
  56. Some HTML tags
  57. HTML标签之table
  58. Table of HTML tag
  59. DataTables of jQuery plug-in
  60. Unity calls Google's free translation API (HTTPS interface). Young people don't speak martial arts. How can they speak in multiple languages