recherche

Maison  >  Article  >  interface Web  >  Comment concaténer des littéraux d’expressions régulières en JavaScript ?

Comment concaténer des littéraux d’expressions régulières en JavaScript ?

WBOY
WBOYavant
2023-09-01 18:45:031185parcourir

Comment concaténer des littéraux d’expressions régulières en JavaScript ?

Un littéral d'expression régulière est une expression régulière, une séquence de caractères qui correspond à une chaîne. Parfois, les développeurs doivent combiner des expressions régulières. Cependant, les expressions régulières sont aussi un type de chaîne, mais nous ne pouvons pas les concaténer en utilisant l'opérateur "+" comme les chaînes.

Nous devons donc d’abord récupérer les drapeaux des deux expressions régulières. Après cela, nous devons filtrer tous les indicateurs uniques et créer une nouvelle regex après avoir combiné plusieurs littéraux d'expression régulière.

Grammaire

Les utilisateurs peuvent suivre la syntaxe suivante pour concaténer des littéraux d'expressions régulières en JavaScript. 

let allFlags = regex1.flags + regex2.flags;
let uniqueFlags = new Set(allFlags.split(''));
allFlags = [...uniqueFlags].join('');
let combined = new RegExp(regex1.source + regex2.source, allFlags);

Dans la syntaxe ci-dessus, nous obtenons d'abord les deux indicateurs d'expression régulière. Après cela, nous créons une collection à partir de celui-ci pour obtenir les drapeaux uniques et combinons les deux littéraux regex.

Exemple 1

Dans l'exemple ci-dessous, nous définissons deux littéraux d'expression régulière. Nous utilisons l'attribut "flags" du littéral regex pour obtenir les drapeaux des deux regex. Après cela, nous avons créé un ensemble de logos pour obtenir un logo unique. Ensuite, nous convertissons la collection en tableau.

Après cela, nous utilisons l'attribut "source" de l'expression régulière pour obtenir le littéral de l'expression régulière et utilisons l'opérateur "+" pour combiner les deux littéraux de l'expression régulière. De plus, nous avons utilisé tous les indicateurs uniques contenus dans les deux littéraux regex lors de la création du littéral regex combiné. 

<html>
<body>
   <h2>Concatenating the <i> Regex literals </i> in JavaScript</h2>
   <div id = "output"> </div>
   <script>
      let output = document.getElementById('output');
      
      // concatenate two regex literals
      let regex1 = /hello/i;
      let regex2 = /world/g;
      let allFlags = regex1.flags + regex2.flags;
      let uniqueFlags = new Set(allFlags.split(''));
      allFlags = [...uniqueFlags].join('');
      let combined = new RegExp(regex1.source + regex2.source, allFlags);
      output.innerHTML += "The first regex is: " + regex1 + "<br>";
      output.innerHTML += "The second regex is: " + regex2 + "<br>";
      output.innerHTML += "The combined regex is: " + combined + "<br>";
   </script>
</body>
</html>

Exemple 2

Dans l'exemple ci-dessous, l'utilisateur doit saisir le littéral de l'expression régulière et les indicateurs associés. De plus, l'utilisateur doit remplir une chaîne d'entrée pour tester à l'aide d'expressions régulières combinées.

Chaque fois que l'utilisateur appuie sur le bouton, il exécute la fonction combineRegex(). Dans celui-ci, nous combinons deux expressions régulières d'entrée avec les indicateurs appropriés. Après cela, nous utilisons la méthode test() pour vérifier si la chaîne correspond à l'expression régulière combinée et renvoyer une valeur booléenne. 

<html>
<body>
   <h2>Concatenating the <i> Regex literals </i> in JavaScript</h2>
   <input type = "text" placeholder = "regex1" id = "regex1">
   <input type = "text" placeholder = "flags" id = "flag1">
   <br> <br>
   <input type = "text" placeholder = "regex2" id = "regex2">
   <input type = "text" placeholder = "flags" id = "flag2">
   <br> <br>
   <input type = "text" placeholder = "string to test regex" id = "str">
   <br> <br>
   <div id = "output"> </div>
   <button id="btn" onclick="combineRegex()"> Combine and Match Regex </button>
   <script>
      let output = document.getElementById('output');
      function combineRegex() {
         let regex1 = new RegExp(document.getElementById('regex1').value, document.getElementById('flag1').value);
         let regex2 = new RegExp(document.getElementById('regex2').value, document.getElementById('flag2').value);
         let allFlags = regex1.flags + regex2.flags;
         let uniqueFlags = new Set(allFlags.split(''));
         allFlags = [...uniqueFlags].join('');
         let combined = new RegExp(regex1.source + regex2.source, allFlags);
         let str = document.getElementById('str').value;
         let result = combined.test(str);
         output.innerHTML += "The combined regex " + combined + " matches the string " + str + " : " + result;
      }
   </script>
</body>
</html>

Exemple 3

Dans l'exemple ci-dessous, nous écrivons d'abord l'expression régulière sous la forme d'une chaîne régulière. Après cela, nous fusionnons les deux chaînes et créons une nouvelle expression régulière à partir de la chaîne combinée à l'aide du constructeur RegExp().

De plus, nous pouvons transmettre les indicateurs requis comme deuxième paramètre. 

<html>
<body>
   <h2>Concatenating the <i> Regex literals </i> in JavaScript</h2>
   <div id = "output"> </div>
   <script>
      let output = document.getElementById('output');
      let part1 = "Hello";
      let part2 = " World";
      var pattern = new RegExp(part1 + part2, "g");
      output.innerHTML = "The combined regex is: " + pattern + "<br>";
   </script>
</body>
</html>

Conclusion

L'utilisateur a appris à concaténer des littéraux d'expressions régulières en JavaScript. Dans le premier exemple, nous concaténons les littéraux d’expression régulière après les avoir créés. Dans l'exemple précédent, nous avons d'abord combiné les chaînes et créé une nouvelle expression régulière à l'aide des chaînes combinées. Cependant, le dernier exemple n'utilise pas de littéral d'expression régulière car il utilise un constructeur pour créer l'expression régulière.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration：
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer
Article précédent：Trouver des fractions entre parenthèses en JavaScriptArticle suivant：Trouver des fractions entre parenthèses en JavaScript

Articles Liés

Voir plus