Maison > interface Web > js tutoriel > Introduction aux bases des expressions régulières javascript_compétences javascript

Introduction aux bases des expressions régulières javascript_compétences javascript

WBOY
Libérer: 2016-05-16 16:03:01
original
1365 Les gens l'ont consulté

Quels sont les avantages des expressions régulières ? Commençons par comprendre :
Nous utilisons la méthode de traitement des chaînes en js pour écrire une fonction permettant d'extraire les nombres dans la chaîne :

 var str='dgh6a567sdo23ujaloo932';
   function getNumber(obj){
     var arr=[];
     for (var i = 0; i < obj.length; i++) {
       if (obj.charAt(i)>='0'&&obj.charAt(i)<='9'){
           arr.push(obj.charAt(i));
         }
     }
     return arr;
   };
   console.log(getNumber(str));  //["6", "5", "6", "7", "2", "3", "9", "3", "2"]
Copier après la connexion

Nous avons retiré les nombres de la chaîne avec la méthode ci-dessus, mais nous ne sommes pas satisfaits. Ce dont nous avons besoin, c'est de la forme ['6','567','23','932'] et transformons la fonction. :

function getNumber(obj){
    var arr=[];
    var temp='';
    for (var i = 0; i < obj.length; i++) {
      if (obj.charAt(i)>='0'&&obj.charAt(i)<='9'){
          temp+=obj.charAt(i);//现将相邻的数字连接起来
        }
        else{ //每当连接的数字断开时,就在这执行
          if (temp) {
            arr.push(temp);
            temp='';
          }
        };
    }
    if (temp) { //这里的作用是为了显示最后数字的,原因不想解释
            arr.push(temp);
            temp='';
          }
    return arr;
  };
Copier après la connexion

Ensuite, nous utilisons des expressions régulières pour résoudre les fonctions implémentées par cette fonction :

function getNumber2(obj){
    var arr=[];
    var re=/\d+/g;
    arr.push(obj.match(re));
    return arr;
  };
Copier après la connexion

Jetons un aperçu complet des résultats en cours du programme :

<!DOCTYPE>
<html>
<head>
  <meta charset='utf-8'>
  <title></title>
</head>
<script type="text/javascript">
window.onload=function(){
  var str='dgh6a567sdo23ujaloo932';
  /*function getNumber(obj){
    var arr=[];
    for (var i = 0; i < obj.length; i++) {
      if (obj.charAt(i)>='0'&&obj.charAt(i)<='9'){
          arr.push(obj.charAt(i));
        }
    }
    return arr;
  };*/
  function getNumber(obj){
    var arr=[];
    var temp='';
    for (var i = 0; i < obj.length; i++) {
      if (obj.charAt(i)>='0'&&obj.charAt(i)<='9'){
          temp+=obj.charAt(i);//现将相邻的数字连接起来
        }
        else{ //每当连接的数字断开时,就在这执行
          if (temp) {
            arr.push(temp);
            temp='';
          }
        };
    }
    if (temp) { //这里的作用是为了显示最后数字的,原因不想解释
            arr.push(temp);
            temp='';
          }
    return arr;
  };
  function getNumber2(obj){
    var arr=[];
    var re=/\d+/g;
    arr.push(obj.match(re));
    return arr;
  };
  console.log(getNumber(str));
  console.log(getNumber2(str)); 
};
</script>
<body>
</body>
</html>
Copier après la connexion

Nous pouvons voir dans l'exemple ci-dessus que la méthode des expressions régulières a le même effet, mais le code est plus court et plus efficace. C'est l'avantage des expressions régulières
. Les expressions régulières sont créées pour traiter les chaînes plus efficacement. Elles sont identiques aux méthodes de traitement de chaînes, mais plus efficaces et concises (les expressions régulières ne peuvent traiter que les chaînes)

Étudions systématiquement quelques méthodes courantes de régularisation :

Avant cela, parlons de la façon d'écrire des expressions régulières. Les expressions régulières sont les mêmes que les autres objets array(), object(), Date(), etc., et elles ont toutes des méthodes d'initialisation
var re=/Vous devez écrire les éléments correspondants ici. Si vous ne l'écrivez pas, vous vous concentrerez simplement sur le symbole/; //Il s'agit d'une simple création d'un objet régulier, je l'utiliserai directement dans les articles suivants.
var re=new RegExp(); //Cette façon de créer est également possible, tout le monde le sait, mais la différence avec l'abréviation est que le passage des paramètres est un peu différent

(1)test

Signification : faites correspondre régulièrement les chaînes, retournez vrai lorsque la correspondance est réussie, sinon, retournez faux
; Syntaxe : re.test(string);
Parlons d'abord des caractères d'échappement :
/s espace /S non-espace /d nombre /D non-chiffre /w caractère (lettre, chiffre, trait de soulignement) /W non-caractère
Par exemple : Déterminez si une chaîne est composée uniquement de nombres

<!DOCTYPE>
<html>
<head>
  <meta charset='utf-8'> 
  <title></title>
</head>
<script type="text/javascript">
window.onload=function(){
  var str='dgh6a567sdo23ujaloo932';
  var str2='123456';
  function allNumber(obj){
    var re=/\D/;//定义正则对象匹配非数字,只要有不是数字的就是匹配结束返回结果
    if (re.test(obj)) {
      alert('不全是数字');
    }
    else{
      alert('全是数字');
    };
  };
  allNumber(str);
  allNumber(str2);

};
</script>
<body>
</body>
</html>

Copier après la connexion

(2) recherche

Signification : faire correspondre régulièrement les chaînes. Lorsque la correspondance est réussie, la position de la correspondance réussie est renvoyée. Sinon, -1 est renvoyée ; la même fonction que indexof() dans la méthode de traitement des chaînes. Syntaxe : string.search(re);
[color=Red]Remarque : L'expression régulière est sensible à la casse par défaut. Pour la rendre insensible à la casse, ajoutez l'indicateur i ;[/color]
. Exemple de correspondance régulière insensible à la casse d'un certain caractère
dans une chaîne

<!DOCTYPE>
<html>
<head>
  <meta charset='utf-8'> 
  <title></title>
</head>
<script type="text/javascript">
window.onload=function(){
  var str='dgh6b567sdo23ujaloo932';
  function searchStr(obj){
    var re=/B/i;//定义正则对象匹配b字符,不区分大小写
    alert(obj.search(re));  
  };
  searchStr(str);
};
</script>
<body>
</body>
</html>
Copier après la connexion

(3) correspondance

Signification : faire correspondre régulièrement les chaînes. Lorsque la correspondance est réussie, un tableau de correspondances réussies sera renvoyé. Sinon, Null

sera renvoyé. Syntaxe : string.match(re);
[color=Red] Remarque : La valeur par défaut de l'expression régulière est que tant que la correspondance réussit, elle se terminera immédiatement et renverra la valeur correspondante, et la correspondance ne continuera pas. Si vous voulez tous les trouver, vous devez ajouter g (correspondance globale) [/color]
Exemple : faites correspondre des nombres consécutifs dans une chaîne et stockez-les dans un tableau (les nombres consécutifs sont utilisés comme élément dans le tableau)

Le " " dans le programme signifie que le match se produit au moins une fois. Pourquoi faisons-nous cela ?

Nous avons mentionné plus tôt que "la valeur par défaut dans les expressions régulières est que tant que la correspondance réussit, elle se terminera immédiatement et renverra la valeur correspondante. Elle se terminera ensuite lorsqu'un nombre correspondra dans la chaîne et qu'un nombre sera renvoyé". au tableau À ce stade, nous avons besoin d’utiliser g pour le faire correspondre à chaque élément.
Avez-vous déjà découvert qu'il n'existe pas de nombre défini de nombres consécutifs ? Vous pouvez utiliser " " pour répondre au nombre dynamique de nombres.

<!DOCTYPE>
<html>
<head>
  <meta charset='utf-8'> 
  <title></title>
</head>
<script type="text/javascript">
window.onload=function(){
  var str='dgh6b567sdo23ujaloo932';
  function searchStr1(obj){
    var re=/\d/;  
    return obj.match(re);
  };
  function searchStr2(obj){
    var re=/\d/g;  
    return obj.match(re);
  };
  function searchStr3(obj){
    var re=/\d\d/g;//全局匹配2位数  
    return obj.match(re);
  };
  function searchStr4(obj){
    var re=/\d+/g;  
    return obj.match(re);
  };
  console.log(searchStr1(str));
  console.log(searchStr2(str));
  console.log(searchStr3(str));
  console.log(searchStr4(str));

};
</script>
<body>
</body>
</html>

Copier après la connexion

(4)remplacer

Signification : faire correspondre régulièrement les chaînes, et lorsque la chaîne correspondante avec succès est remplacée par une nouvelle chaîne

Syntaxe : string.replace(re);
Exemple : Remplacez tous les a de la chaîne par b

<!DOCTYPE>
<html>
<head>
 <meta charset='utf-8'> 
 <title></title>
</head>
<script type="text/javascript">
window.onload=function(){
 var str='daah6b5a7sdo23ujaloo932';
 function replaceStr(obj){
  var re=/a/g; //全局匹配a
  return obj.replace(re,'b');
 };
 console.log(replaceStr(str));
};
</script>
<body>
</body>
</html>
Copier après la connexion
J'écrirai ici pour le moment et je ferai le suivi des mises à jour. . .

Ce qui précède représente l’intégralité du contenu de cet article, j’espère que vous l’aimerez tous.

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal