Panduan pemula untuk ungkapan biasa dalam JavaScript

Semua orang yang menggunakan JavaScript perlu berurusan dengan rentetan pada satu ketika. Kadangkala anda hanya menyimpan rentetan dalam pembolehubah lain dan menyampaikannya. Pada masa lain anda perlu memeriksanya dan melihat sama ada ia mengandungi subrentetan tertentu.

Namun, perkara tidak selalunya mudah. Kadangkala anda tidak mencari subrentetan tertentu, sebaliknya satu set subrentetan yang mengikut corak tertentu.

Andaikan anda perlu menggantikan semua kejadian "Epal" dalam rentetan dengan "epal". Anda boleh menggunakan theMainString.replace("Apples", "apples"). Baik dan mudah. theMainString.replace("Apples", "apples")。好，易于。

现在假设您还必须将“appLes”替换为“apples”。同样，“appLES”也应该变成“apples”。基本上，“Apple”的所有大小写变体都需要更改为“apple”。在这种情况下，传递简单字符串作为参数将不再实用或高效。

这就是正则表达式的用武之地 - 您可以简单地使用不区分大小写的标志 i 并完成它。使用该标志后，原始字符串是否包含“Apples”、“APPles”、“ApPlEs”或“Apples”并不重要。该单词的每个实例都将替换为“apples”。

就像不区分大小写的标志一样，正则表达式提供了许多其他功能，本教程将介绍这些功能。

在 JavaScript 中使用正则表达式

您必须使用稍微不同的语法来指示不同 String 方法内的正则表达式。与用引号括起来的简单字符串不同，正则表达式由括在斜杠之间的模式组成。您在正则表达式中使用的任何标志都将附加在第二个斜杠之后。

回到前面的示例，下面是 replace() 方法使用正则表达式和简单字符串的样子。

"I ate Apples".replace("Apples", "apples");
// I ate apples

"I ate Apples".replace(/Apples/i, "apples");
// I ate apples

"I ate aPPles".replace("Apples", "apples");
// I ate aPPles

"I ate aPPles".replace(/Apples/i, "apples");
// I ate apples

正如您所看到的，正则表达式在这两种情况下都有效。我们现在将了解有关构成正则表达式内模式的标志和特殊字符的更多信息。

正则表达式中的反斜杠

您可以通过在普通字符前添加反斜杠将其转换为特殊字符。同样，您可以通过在特殊字符前添加反斜杠将其转换为普通字符。

例如，d 不是特殊字符。然而， d 用于匹配字符串中的数字字符。同样，D 也不是特殊字符，但 D 用于匹配字符串中的非数字字符。

数字字符包括 0、1、2、3、4、5、6、7、8 和 9。当您在正则表达式中使用 d 时，它将匹配以下任何一个九个字符。当您在正则表达式中使用 D 时，它将匹配所有非数字字符。

下面的例子应该可以让事情变得清楚。

"L8".replace(/\d/i, "E");
// LE

"L8".replace(/\D/i, "E");
// E8

"LLLLL8".replace(/\D/i, "E");
// ELLLL8

您应该注意，在第三种情况下，仅替换第一个匹配的字符。您还可以使用标志来替换所有匹配项。我们稍后将了解此类标志。

就像 d 和 D 一样，还有其他特殊字符序列。

1. 您可以使用 w 来匹配字符串中的任何“word”字符。这里，单词字符是指A-Z、a-z、0-9和_。因此，基本上，它将匹配所有数字、所有小写和大写字母以及下划线。
2. 您可以使用 W 来匹配字符串中的任何非单词字符。它将匹配 %、$、#、 $ 等字符。
3. 您可以使用 s 来匹配单个空白字符，其中包括空格、制表符、换页符和换行符。同样，您可以使用 S 来匹配除空格之外的所有其他字符。
4. 您还可以使用 f、n、r、t 和 v

Sekarang andaikan anda juga perlu menggantikan "appLes" dengan "epal". Begitu juga, "epal" harus menjadi "epal". Pada asasnya, semua variasi kes "Apple" perlu ditukar kepada "epal". Dalam kes ini, menghantar rentetan ringkas sebagai hujah tidak lagi praktikal atau cekap. Di sinilah ungkapan biasa masuk - anda hanya boleh menggunakan bendera tidak peka huruf besar-kecil i dan selesai dengannya. Dengan bendera ini, tidak kira sama ada rentetan asal mengandungi "Apple", "APPles", "ApPlEs" atau "Apples". Setiap contoh perkataan akan digantikan dengan "epal". Sama seperti bendera tidak peka huruf besar-besaran, ungkapan biasa menyediakan banyak ciri lain, yang akan dilindungi oleh tutorial ini.

Menggunakan ungkapan biasa dalam JavaScript

Anda mesti menggunakan sintaks yang sedikit berbeza untuk menunjukkan ungkapan biasa dalam kaedah String yang berbeza. Tidak seperti rentetan ringkas yang disertakan dalam petikan, ungkapan biasa terdiri daripada corak yang disertakan di antara garis miring. Sebarang bendera yang anda gunakan dalam ungkapan biasa akan dilampirkan selepas garis miring kedua.

Kembali kepada contoh sebelumnya, berikut ialah kaedah replace() menggunakan ungkapan biasa dan rentetan ringkas.

"A lot of pineapple images were posted on the app".replace(/app/, "board");
// A lot of pineboardle images were posted on the app

"A lot of pineapple images were posted on the app".replace(/\bapp/, "board");
// A lot of pineapple images were posted on the board

#🎜🎜#Seperti yang anda lihat, ungkapan biasa berfungsi dalam kedua-dua kes. Kini kita akan mengetahui lebih lanjut tentang bendera dan aksara khas yang membentuk corak dalam ungkapan biasa. #🎜🎜#

Las balas dalam ungkapan biasa

#🎜🎜#Anda boleh menukar aksara biasa kepada aksara khas dengan menambahkan garis serong ke belakang di hadapannya. Begitu juga, anda boleh menukar aksara khas kepada aksara biasa dengan menambahkan garis miring ke belakang di hadapannya. #🎜🎜# #🎜🎜#Sebagai contoh, d bukanlah watak istimewa. Walau bagaimanapun, d digunakan untuk memadankan aksara angka dalam rentetan. Begitu juga, D bukan aksara khas, tetapi D digunakan untuk memadankan aksara bukan angka dalam rentetan. #🎜🎜# #🎜🎜#Aksara nombor termasuk 0, 1, 2, 3, 4, 5, 6, 7, 8 dan 9. Apabila anda menggunakan d dalam ungkapan biasa, ia akan sepadan dengan mana-mana sembilan aksara berikut. Apabila anda menggunakan D dalam ungkapan biasa, ia akan sepadan dengan semua aksara bukan angka. #🎜🎜# #🎜🎜#Contoh berikut sepatutnya menjelaskan perkara ini. #🎜🎜##🎜🎜##🎜🎜#

"Apppppples".replace(/Ap*/, "App");
// Apples

"Ales".replace(/Ap*/, "App");
// Apples

"Appppples".replace(/Ap{2}/, "Add");
// Addppples

"Appppples".replace(/Ap{2,}/, "Add");
// Addles

"Appppples".replace(/Ap{2,4}/, "Add");
// Addples

#🎜🎜# Anda harus ambil perhatian bahawa dalam kes ketiga, hanya aksara padanan pertama diganti. Anda juga boleh menggunakan bendera untuk menggantikan semua perlawanan. Kita akan belajar tentang bendera tersebut nanti. #🎜🎜##🎜🎜##🎜🎜# #🎜🎜#Sama seperti d dan D, terdapat jujukan aksara khas yang lain. #🎜🎜#

1. Anda boleh menggunakan w untuk memadankan mana-mana aksara "perkataan" dalam rentetan. Di sini, aksara perkataan merujuk kepada A-Z, a-z, 0-9 dan _. Jadi pada asasnya, ia akan sepadan dengan semua nombor, semua huruf kecil dan huruf besar, dan garis bawah. #🎜🎜#
2. Anda boleh menggunakan W untuk memadankan mana-mana aksara bukan perkataan dalam rentetan. Ia akan sepadan dengan aksara seperti %, $, #, $, dll. #🎜🎜#
3. Anda boleh menggunakan s untuk memadankan aksara ruang putih tunggal, termasuk ruang, tab, formfeed dan aksara baris baharu. Begitu juga, anda boleh menggunakan S untuk memadankan semua aksara lain kecuali ruang. #🎜🎜#
4. Anda juga boleh menggunakan f, n, r, t dan v, yang masing-masing mewakili suapan halaman, suapan baris, carriage return, tab mendatar dan tab menegak . #🎜🎜# #🎜🎜# #🎜🎜# Kadangkala anda akan berada dalam situasi di mana anda perlu menggantikan perkataan dengan alternatif, tetapi hanya jika ia #🎜🎜# bukan #🎜🎜##🎜🎜# #🎜🎜#sebahagian daripada perkataan yang lebih besar . Sebagai contoh, pertimbangkan ayat berikut: #🎜🎜# #🎜🎜# "Banyak gambar nanas disiarkan pada apl". #🎜🎜# #🎜🎜#Dalam contoh ini, kami ingin menggantikan perkataan "app" dengan "board". Walau bagaimanapun, menggunakan corak regex mudah akan menukar "epal" menjadi "boardle" dan ayat akhir akan menjadi: #🎜🎜# #🎜🎜# "Terdapat banyak imej papan pain disiarkan pada apl". #🎜🎜#

   在这种情况下，您可以使用另一个特殊字符序列：\b。这会检查单词边界。单词边界是通过使用任何非单词字符（如空格、“$”、“%”、“#”等）形成的。不过请注意，它还包括重音字符，如“ü”。

   "A lot of pineapple images were posted on the app".replace(/app/, "board");
   // A lot of pineboardle images were posted on the app
   
   "A lot of pineapple images were posted on the app".replace(/\bapp/, "board");
   // A lot of pineapple images were posted on the board
   

   同样，您可以使用 \B 来匹配非单词边界。例如，您可以使用 \B 仅匹配位于另一个单词（如“pineapple”）内的“app”。

   匹配模式“n”次

   您可以使用 ^ 告诉 JavaScript 仅查看字符串的开头以进行匹配。同样，您可以使用 $ 仅查看字符串末尾的匹配项。

   您可以使用 * 来匹配前面的表达式 0 次或多次。例如，/Ap*/ 将匹配 A、Ap、App、Appp强>，等等。

   类似地，您可以使用 + 来匹配前面的表达式 1 次或多次。例如，/Ap+/ 将匹配 Ap、App、Appp 等。这次表达式将不会匹配单个 A。

   有时，您只想匹配给定模式的特定出现次数。在这种情况下，您应该使用 {n} 字符序列，其中 n 是数字。例如，/Ap{2}/ 将匹配 App，但不匹配 Ap。它还将匹配 Appp 中的前两个“p”，并保持第三个“p”不变。

   您可以使用 {n,} 来匹配给定表达式的至少“n”次出现。这意味着 /Ap{2,}/ 将匹配 App，但不匹配 Ap。它还将匹配 Apppp 中的所有“p”，并将它们替换为您的替换字符串。

   您还可以使用 {n,m} 指定最小和最大数量，并限制给定表达式应匹配的次数。例如，/Ap{2,4}/ 将匹配 App、Appp 和 Apppp。它还将匹配 Apppppp 中的前四个“p”，并保持其余部分不变。

   "Apppppples".replace(/Ap*/, "App");
   // Apples
   
   "Ales".replace(/Ap*/, "App");
   // Apples
   
   "Appppples".replace(/Ap{2}/, "Add");
   // Addppples
   
   "Appppples".replace(/Ap{2,}/, "Add");
   // Addles
   
   "Appppples".replace(/Ap{2,4}/, "Add");
   // Addples
   

   使用括号来记住匹配

   到目前为止，我们只用常量字符串替换了模式。例如，在上一节中，我们使用的替换始终是“Add”。有时，您必须在给定字符串中查找模式匹配，然后将其替换为模式的一部分。

   假设您必须在字符串中找到一个包含五个或更多字母的单词，然后在该单词的末尾添加一个“s”。在这种情况下，您将无法使用常量字符串值作为替换，因为最终值取决于匹配模式本身。

   "I like Apple".replace(/(\w{5,})/, '$1s');
   // I like Apples
   
   "I like Banana".replace(/(\w{5,})/, '$1s');
   // I like Bananas
   

   这是一个简单的示例，但您可以使用相同的技术在内存中保留多个匹配模式。完整匹配中的子模式数量将由使用的括号数量决定。

   在替换字符串中，第一个子匹配将使用 $1 标识，第二个子匹配将使用 $2 标识，依此类推。这是另一个例子，进一步阐明括号的用法。

   "I am looking for John and Jason".replace(/(\w+)\sand\s(\w+)/, '$2 and $1');
   // I am looking for Jason and John
   

   将标志与正则表达式结合使用

   正如我在简介中提到的，正则表达式的一个更重要的功能是使用特殊标志来修改搜索的执行方式。这些标志是可选的，但您可以使用它们来执行诸如全局搜索或不区分大小写之类的操作。

   这些是四个常用的标志，用于更改 JavaScript 搜索或替换字符串的方式。

   • g：该标志将执行全局搜索，而不是在第一个匹配后停止。
   • i：此标志将执行搜索，而不检查大小写是否完全匹配。例如，在不区分大小写的搜索中，Apple、aPPLe 和 apPLE 的处理方式都是相同的。
   • m：该标志将执行多行搜索。
   • y：此标志将在 lastIndex 属性指示的索引中查找匹配项。

   以下是与标志一起使用的正则表达式的一些示例：

   "I ate apples, you ate apples".replace(/apples/, "mangoes");
   // "I ate mangoes, you ate apples"
   
   "I ate apples, you ate apples".replace(/apples/g, "mangoes");
   // "I ate mangoes, you ate mangoes"
   
   "I ate apples, you ate APPLES".replace(/apples/, "mangoes");
   // "I ate mangoes, you ate APPLES"
   
   "I ate apples, you ate APPLES".replace(/apples/gi, "mangoes");
   // "I ate mangoes, you ate mangoes"
   
   
   var stickyRegex = /apples/y;
   stickyRegex.lastIndex = 3;
   "I ate apples, you ate apples".replace(stickyRegex, "mangoes");
   // "I ate apples, you ate apples"
   
   var stickyRegex = /apples/y;
   stickyRegex.lastIndex = 6;
   "I ate apples, you ate apples".replace(stickyRegex, "mangoes");
   // "I ate mangoes, you ate apples"
   
   var stickyRegex = /apples/y;
   stickyRegex.lastIndex = 8;
   "I ate apples, you ate apples".replace(stickyRegex, "mangoes");
   // "I ate apples, you ate apples"
   

   最终想法

   本教程的目的是向您介绍 JavaScript 中的正则表达式及其重要性。我们从基础知识开始，然后介绍反斜杠和其他特殊字符。我们还学习了如何检查字符串中的重复模式以及如何记住模式中的部分匹配以便以后使用它们。

   最后，我们了解了常用的标志，它们使正则表达式变得更加强大。您可以在 MDN 上的这篇文章中了解有关正则表达式的更多信息。

   Jika anda mahu saya menjelaskan apa-apa dalam tutorial ini, sila beritahu saya dalam komen.

Atas ialah kandungan terperinci Panduan pemula untuk ungkapan biasa dalam JavaScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!