Reguläre Ausdrücke der JS-Basisserie

Reguläre Ausdrücke sind eine sehr mächtige Sache. Ich werde sie heute einfach allen JS-Neulingen vorstellen. Wenn es kontroverse Aspekte gibt, hinterlassen Sie bitte eine Nachricht.



1.1 Was ist ein regulärer Ausdruck?

Ein regulärer Ausdruck ist ein Objekt, das ein Zeichenmuster beschreibt, das ECMAScript durch die RegExp-Klasse darstellt reguläre Ausdrücke, und sowohl String als auch RegExp definieren Funktionen für einen leistungsstarken Mustervergleich sowie das Abrufen und Ersetzen von Text mithilfe regulärer Ausdrücke.

Reguläre Ausdrücke werden verwendet, um Zeichenfolgenmuster abzugleichen und abzurufen und zu ersetzen. Sie sind ein leistungsstarkes Werkzeug zum Durchführen eines Mustervergleichs für Zeichenfolgen.

1.2 Die Rolle regulärer Ausdrücke

Reguläre Ausdrücke werden hauptsächlich zur Überprüfung der Eingabedaten des Clients verwendet.

Nachdem der Benutzer das Formular ausgefüllt und auf die Schaltfläche geklickt hat, wird das Formular an den Server gesendet. Auf der Serverseite wird es normalerweise mithilfe von Serverskripten wie PHP, ASP.NET und JSP weiterverarbeitet . Aufgrund der clientseitigen Überprüfung können viele serverseitige Systemressourcen eingespart und eine bessere Benutzererfahrung bereitgestellt werden.

2. Erstellen Sie einen regulären Ausdruck==(123)==

Um einen regulären Ausdruck zu verwenden, müssen Sie zunächst ein reguläres Ausdrucksobjekt erstellen der zu erstellenden Objekte. Methode:

2.1 Methode 1: Verwenden Sie das Schlüsselwort new, um den Parameter

var patt = new RegExp(pattern,modifiers);

zu erstellen 1: Stilmuster für reguläre Ausdrücke. Zeichenfolgenform

Parameter 2: Modusmodifikator. Wird verwendet, um den globalen Abgleich, den Abgleich unter Berücksichtigung der Groß-/Kleinschreibung und den mehrzeiligen Abgleich anzugeben

<script type="text/javascript">
  /*
   创建了一个正则表达式
   参数1：模式是：girl，意思是说可以匹配 "girl"这样的字符串
   参数2：模式修饰符：gi g代表全局匹配 i代表不区分大小写
  */
 var pa = new RegExp("girl", "gi");
  //测试参数中的字符串"你好我的girl" 是否与匹配模式匹配。
  var isExist = pa.test("你好我的girl"); // 在本例中，是匹配的，这个字符串包含girl，所以返回true
  alert(isExist); //true
</script>

2.2 Methode 2: Verwenden Sie die direkte Menge regulärer Ausdrücke

var pa = /pattern/modifiers;

Die beiden /s in der Mitte stellen das reguläre Ausdrucksmuster dar, und auf das letzte / folgt der Mustermodifikator

Zum Beispiel: Das obige Beispiel kann wie folgt geschrieben werden: var pa = /girl/gi;

Hinweis: Zu diesem Zeitpunkt können der Modus und der Modusmodifikator doppelte oder einfache Anführungszeichen hinzufügen

<script type="text/javascript">
 var pa = /girl/gi;
 alert(pa.test("厉害了我的girl")); //true
</script>

3. Mustermodifikatoren für reguläre Ausdrücke==(126)==

Es gibt 3 Mustermodifikatoren in JavaScript: g i u

g: stellt die globale Situation dar. Dies bedeutet, dass eine Zeichenfolge mehrfach abgeglichen wird. Wenn g nicht geschrieben ist, erfolgt nur eine Übereinstimmung. Sobald die Übereinstimmung erfolgreich ist, wird keine erneute Übereinstimmung erzielt.

i: Zeigt an, dass die Groß-/Kleinschreibung ignoriert wird. Dies bedeutet, dass beim Abgleich die Groß-/Kleinschreibung nicht beachtet wird.

u: Zeigt an, dass mehrere Zeilen abgeglichen werden können.

4. Detaillierte Erläuterung der regulären Ausdrucksmethoden==(127)==

Es gibt zwei häufig verwendete reguläre Ausdrucksmethoden: test() und exec()

4.1 test()-Methode

test(string)

Parameter: Zeichenfolge zum Abgleichen

Rückgabewert: Gibt true zurück, wenn die Übereinstimmung ist erfolgreich, falsch, wenn fehlgeschlagen

Die Verwendung dieser Methode ist sehr praktisch, wenn Sie nur wissen möchten, ob die Zielzeichenfolge mit einem bestimmten Muster übereinstimmt, aber nicht den Textinhalt kennen müssen. Daher wird die test()-Methode häufig in if-Anweisungen verwendet.

<script type="text/javascript">
 var pa = /girl/gi;
 if(pa.test("厉害了我的girl")){
  alert("这个女孩和你很配");
 }else {
  alert("你注定没有女孩去匹配");
 }
</script>

4.2 exec()-Methode

exec(string): Diese Methode ist speziell für die Erfassung konzipiert durch die Gruppe

Parameter: Die zu vergleichende Zeichenfolge

Rückgabewert: Es wird ein Array zurückgegeben. Wenn es keine Übereinstimmung gibt, geben Sie null zurück

Über das Rückgabewert-Array:

Es ist tatsächlich eine Instanz von Array.

Dieses Array verfügt jedoch über zwei zusätzliche Attribute: Index und Eingabe.

Index: stellt den Index der übereinstimmenden Zeichenfolge in der Quellzeichenfolge dar.

Eingabe: stellt die übereinstimmende Quellzeichenfolge dar.

Das erste Element im Array ist die Zeichenfolge, die mit dem gesamten Muster übereinstimmt, und die anderen Elemente sind Zeichenfolgen, die mit den Erfassungsgruppen im Muster übereinstimmen.

Wenn es keine Erfassungsgruppe gibt, gibt es eine nur das erste Element im Array. Wir werden später über das Konzept der Gruppenerfassung sprechen

<script type="text/javascript">
 var pa = /girl/gi;
 var testStr = "myGirl, yourgirl, hisgIrl";
 var girls = pa.exec(testStr); //捕获
 alert(girls.length + ":" + (girls instanceof Array)); //正则表达式没有捕获组，所以数组长度为1
 alert(girls[0]); //第一次捕获的是 Girl
  //因为我们是用的全局匹配，所以此次匹配的时候从上次匹后的位置开始继续匹配
 alert(pa.exec(testStr)[0]);  // girl
 alert(pa.exec(testStr)); // gIrl
 alert(pa.exec(testStr)); //继续向后没有匹配的字符串，所以返回null
  // 返回null，如果继续再匹配，则会回到字符串的开始，重写开始匹配。
 alert(pa.exec(testStr)); // Girl
  // ...开启新一轮匹配
</script>

Wenn wir also alle passenden Zeichenfolgen finden möchten, können wir eine Schleife verwenden. Die Endbedingung ist, dass das Übereinstimmungsergebnis null ist

<script type="text/javascript">
 var pa = /girl/gi;
 var testStr = "myGirl, yourgirl, hisgIrl";
 var girls;
 while(girls = pa.exec(testStr)){ //如果等于null,会自动转成 false，结束。
  alert(girls);
 }
</script>

Gruppe. In () eingeschlossene Aufgaben in regulären Ausdrücken sind eine Gruppe. Gruppen können verschachtelt werden.

<script type="text/javascript">
  //()内的内容就是第1组(Girl)，其实我们完整真个表达式可以看出第0组 girl(Girl)
  // 将来对应着匹配结果数组的下标。 
 var pa = /girl(Girl)/gi; 
 var test = "girlGirl abdfjla Girlgirl fal girl";
 var girls;
 while(girls = pa.exec(test)){
  //匹配之后，数组的第0个元素对应的这第0组的匹配结果，第1个元素对应着第1组的匹配结果
  for (var i = 0; i < girls.length; i++) {
   console.log(girls[i]);
  }
  console.log("-------------");
 }
</script>
//最终运行结果：
girlGirl
Girl
-------------
Girlgirl
girl
------------

五、正则表达式规则==(124)==

表达式规则

正则表达式元字符是包含特殊含义的字符。它们有一些特殊功能，可以控制匹配模式的

方式。反斜杠后的元字符将失去其特殊含义。

字符类：单个字符和数字

[0-9A-Za-z]  

元字符/元符号                    匹配情况

.                         匹配除换行符外的任意字符

[a-z0-9]                     匹配括号中的字符集中的任意字符

[^a-z0-9]                     匹配任意不在括号中的字符集中的字符

\d ==[0-9]                    匹配数字

\D ==[^0-9]                        匹配非数字，同[^0-9]相同

\w     [0-9A-Za-z_]                    匹配字母和数字及_

\W                         匹配非(字母和数字及_)

字符类：空白字符

元字符/元符号                    匹配情况

\0                             匹配null 字符

\b                             匹配空格字符

\n                             匹配换行符

\r                             匹配回车字符

\t                             匹配制表符

\s                             匹配空白字符、空格、制表符和换行符

\S                             匹配非空白字符

字符类：锚字符

元字符/元符号                    匹配情况

^                             行首匹配

$                             行尾匹配

字符类：重复字符

元字符/元符号                                匹配情况

?  例如（x?）                            匹配0个或1 个x

*  例如（x*）                            匹配0个或任意多个x

+  例如（x+）                            匹配至少一个x

(xyz)+                                     匹配至少一个(xyz)

{m,n} 例如x{m,n}  n>=次数>=m            匹配最少m个、最多n个x

{n}                                        匹配前一项n次    

{n,}          匹配前一项n次，或者多次

六、常用正则表示==(128)==

1、检查邮政编码

var pattern = /[1-9][0-9]{5}/; //共6位数字，第一位不能为0
var str = '224000';
alert(pattern.test(str));

2、检查文件压缩包

var pattern = /[\w]+\.zip|rar|gz/; //\w 表示所有数字和字母加下划线
var str = '123.zip'; //\.表示匹配.，后面是一个选择
alert(pattern.test(str));

3、删除多余空格

var pattern = /\s/g; //g 必须全局，才能全部匹配
var reg=new RegExp('\\s+','g');
var str = '111 222 333';
var result = str.replace(pattern,''); //把空格匹配成无空格
alert(result);

4、删除空格

var pattern = /^\s+/; 
var str = ' goo gle ';
alert(str+" "+str.length);
var result = str.replace(pattern, '');
alert(result+" "+result.length);
pattern = /\s+$/; 
result = result.replace(pattern, '');
alert(result+" "+result.length);
pattern = /\s+/g; 
result = result.replace(pattern, '');
alert(result+" "+result.length);
5、简单的电子邮件验证
var pattern = /^([a-zA-Z0-9_\.\-]+)@([a-zA-Z0-9_\.\-]+)\.([a-zA-Z]{2,4})$/;
var str = 'yc60.com@gmail.com';
alert(pattern.test(str));
var pattern = /^([\w\.\-]+)@([\w\.\-]+)\.([\w]{2,4})$/;
var str = 'yc60.com@gmail.com';
alert(pattern.test(str));

七、支持正则表达式的字符串方法

方法	描述
search	检索与正则表达式相匹配的第一个匹配项的索引。
match	找到一个或多个正则表达式的匹配。
replace	替换与正则表达式匹配的子串。
split	把字符串分割为字符串数组。

<script type="text/javascript">
 var s = "Abc123aBc";
 alert(s.search(/abc/gi)); 
 alert(s.search(/abc/gi)); // 即使设置的全局模式，每次search也是从开始向后查找
 //match方法和正则表达式的exec()方法的作用是一样的，但是match会一次性把所有的匹配放在一个数组中，全部返回
 alert(s.match(/abc/gi)); // Abc,aBc
 alert(s.replace(/[ab]/gi, "x"));   //把a或b替换成x
 var ss = s.split(/[0-9]+/gi); //用1个或多个数字切割。 Abc,aBc
 alert(ss);
</script>

以上所述是小编给大家介绍的JS基础系列之正则表达式，更多相关内容请关注PHP中文网（www.php.cn）！