Maison > interface Web > js tutoriel > le corps du texte

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

WBOY
Libérer: 2023-09-01 18:45:03
avant
1171 Les gens l'ont consulté

Comment concaténer des littéraux dexpressions 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);
Copier après la connexion

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>
Copier après la connexion

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>
Copier après la connexion

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>
Copier après la connexion

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!

source:tutorialspoint.com
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
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!