Rumah > hujung hadapan web > tutorial js > Ungkapan biasa JavaScript, artikel ini sudah memadai

Ungkapan biasa JavaScript, artikel ini sudah memadai

WBOY
Lepaskan: 2022-03-21 18:02:36
ke hadapan
3022 orang telah melayarinya

Artikel ini membawa anda pengetahuan yang berkaitan tentang javascript, yang terutamanya memperkenalkan isu yang berkaitan dengan ungkapan biasa ialah corak pemformatan khusus yang digunakan untuk mengesahkan pelbagai Sama ada rentetan sepadan dengan ciri ini dan kemudian melaksanakan teks lanjutan. carian, penggantian, pemintasan kandungan dan operasi lain saya harap ia akan membantu semua orang.

Ungkapan biasa JavaScript, artikel ini sudah memadai

Cadangan berkaitan: Tutorial javascript

Apakah itu ungkapan biasa

Ungkapan biasa (Ungkapan Biasa, dirujuk sebagai regexp)

  • ialah peraturan tatabahasa yang menerangkan struktur rentetan.
  • ialah corak pemformatan khusus yang digunakan untuk mengesahkan sama ada pelbagai rentetan sepadan dengan ciri ini, dengan itu membolehkan carian teks lanjutan, penggantian, pemintasan kandungan dan operasi lain.

Aplikasi: Dalam pembangunan projek, fungsi seperti menyembunyikan digit nombor telefon mudah alih yang ditentukan, pengumpulan data, penapisan perkataan sensitif dan pengesahan borang semuanya boleh dilaksanakan menggunakan ungkapan biasa.

Medan yang berkenaan: dalam sistem pengendalian (Unix, Linux, dll.), bahasa pengaturcaraan (C, C, Java, PHP, Python, JavaScript, dll.).

Contohnya: Ambil carian teks sebagai contoh Jika anda menemui rentetan yang sepadan dengan ciri tertentu (seperti nombor telefon mudah alih) dalam jumlah teks yang banyak, kemudian tulis ciri ini mengikut sintaks. ungkapan biasa untuk membentuk A Program komputer mengenali corak (Corak), dan kemudian program komputer akan memadankan teks mengikut corak ini untuk mencari rentetan yang memenuhi peraturan.

Sejarah perkembangan ungkapan biasa
Ungkapan biasa JavaScript, artikel ini sudah memadai

Bentuk perwakilan ungkapan biasa

  • Satu ialah ungkapan biasa yang mematuhi spesifikasi POSIX yang digunakan untuk memastikan mudah alih antara sistem pengendalian.
  • Satunya ialah apabila Perl (bahasa pengaturcaraan yang kaya dengan ciri) dibangunkan, ungkapan biasa Perl telah diperolehi Sintaks biasa dalam JavaScript adalah berdasarkan Perl.

Cara menggunakan ungkapan biasa

Dalam pembangunan, selalunya perlu mencari dan memadankan rentetan yang ditentukan berdasarkan corak padanan biasa.

Ungkapan biasa JavaScript, artikel ini sudah memadai

kaedah exec()

  • kaedah exec() digunakan untuk mencari padanan dalam rentetan sasaran, hanya mengembalikan satu perlawanan pada satu keputusan masa.
  • Sebagai contoh, cari abc dalam rentetan str yang ditentukan.

Ungkapan biasa JavaScript, artikel ini sudah memadai

  • "/" dalam "/abc/i" ialah pembatas bagi ungkapan biasa dan "abc" mewakili corak biasa ungkapan Teks, "i" ialah pengecam pengubah suai corak, menunjukkan bahawa kes diabaikan dalam str.
  • Parameter kaedah exec() ialah rentetan str yang akan dipadankan Apabila padanan berjaya, nilai pulangan kaedah ini ialah tatasusunan, jika tidak ia mengembalikan nol.
  • Seperti yang dapat dilihat daripada hasil pulangan exec(), elemen pertama (AbC) yang disimpan dalam tatasusunan mewakili rentetan yang dipadankan, indeks elemen kedua mewakili bahawa aksara yang dipadankan terletak dalam rentetan sasaran nilai indeks dalam (dikira daripada 0 input parameter ketiga mewakili rentetan sasaran (AbC123abc456).

kaedah match()

Selain mendapatkan semula nilai yang ditentukan dalam rentetan, kaedah match() dalam objek String juga boleh mendapatkan semula nilai yang ditentukan dalam rentetan sasaran berdasarkan Padanan biasa sepadan dengan semua kandungan yang memenuhi keperluan Selepas perlawanan berjaya, ia disimpan ke dalam tatasusunan Jika perlawanan gagal, palsu dikembalikan.

Ungkapan biasa JavaScript, artikel ini sudah memadai

  • Pencari "^" boleh digunakan untuk memadankan permulaan rentetan.
  • Pencari "$" boleh digunakan untuk memadankan hujung rentetan.
  • g mewakili perlawanan global, digunakan untuk meneruskan carian selepas perlawanan pertama ditemui.

Dapatkan objek biasa

Dalam aplikasi JavaScript, anda perlu mencipta objek biasa dahulu sebelum menggunakan ungkapan biasa. Sebagai tambahan kepada penciptaan literal yang dijelaskan sebelum ini, ia juga boleh dibuat melalui pembina objek RegExp.

Ungkapan biasa JavaScript, artikel ini sudah memadai

  • corak ialah teks corak ungkapan biasa yang terdiri daripada aksara meta dan aksara teks.
  • Karakter meta ialah aksara dengan makna istimewa, seperti "^", "." atau "*", dsb.
  • Aksara teks ialah teks biasa, seperti huruf dan nombor.
  • bendera mewakili pengecam pengubahsuaian corak, yang digunakan untuk menetapkan lagi ungkapan biasa.

Ungkapan biasa JavaScript, artikel ini sudah memadai

  • Pengubah suai mod juga boleh digunakan secara gabungan mengikut keperluan sebenar.
  • Sebagai contoh, untuk mengabaikan kes dan padanan secara global, anda boleh menggunakan gi secara langsung dan tiada keperluan pesanan semasa menulis berbilang pengubah suai corak.
  • Oleh itu, penggunaan pengubah corak yang munasabah boleh menjadikan ungkapan biasa lebih ringkas dan intuitif.

Untuk membolehkan pembaca lebih memahami pemerolehan objek biasa, ambil padanan aksara khas "^", "$", "*", "" sebagai contohBanding dan terangkan.

Ungkapan biasa JavaScript, artikel ini sudah memadai

  • Pemilih "|" bermaksud "atau", dan syarat carian boleh diwujudkan selagi salah satu syarat dipenuhi.
  • Terdapat masalah melarikan diri dengan rentetan dalam JavaScript, jadi "" dalam str dalam kod mewakili garis serong ke belakang "".
  • Apabila memadankan aksara khas dalam ungkapan biasa, garis miring ke belakang () juga diperlukan untuk melarikan diri daripada aksara khas. Contohnya, "\" menjadi "" selepas rentetan melarikan diri, dan kemudian ungkapan biasa menggunakan "" untuk memadankan "".

Nota

Objek biasa yang dibuat menggunakan kaedah pembina dan kaedah literal, walaupun secara fungsinya serupa, mempunyai perbezaan tertentu dalam pelaksanaan sintaks corak bekas perlu melarikan diri dari garis sengkang terbalik () apabila digunakan. Apabila menulis corak yang terakhir, ia hendaklah diletakkan dalam pembatas "/", dan teg bendera hendaklah diletakkan di luar pembatas penamat

Kategori aksara

Faedah: Penggunaan aksara yang berkesan Kategori boleh membuat ungkapan biasa lebih ringkas dan lebih mudah dibaca.

Contoh 1: Huruf besar, huruf kecil dan nombor boleh diwakili secara langsung dengan "w".

Kes 2: Jika anda ingin memadankan nombor antara 0 dan 9, anda boleh menggunakan "d".

Ungkapan biasa JavaScript, artikel ini sudah memadai

Untuk memudahkan pembaca memahami penggunaan kategori watak, berikut menggunakan "." dan "s" sebagai contoh untuk demonstrasi.

Ungkapan biasa JavaScript, artikel ini sudah memadai

  • Reg objek biasa digunakan untuk memadankan mana-mana dua aksara selepas aksara ruang putih (kecuali baris baharu).
  • Oleh itu, dalam hasil yang dilihat pada konsol, terdapat ruang sebelum id.

Set aksara

Perwakilan set aksara: "[]" boleh melaksanakan set aksara.

Julat aksara: Apabila digunakan bersama tanda sempang "-", ia bermaksud memadankan aksara dalam julat yang ditentukan.

Watak antonim: Apabila metacharacter "^" digunakan bersama "[]", ia dipanggil watak antonim.

tidak berada dalam julat tertentu: "^" digunakan bersama "[]" untuk memadankan aksara yang tidak berada dalam julat aksara yang ditentukan.

Ambil rentetan 'get好TB6'.match(/pattern/g) sebagai contoh untuk menunjukkan penggunaan biasanya.

Ungkapan biasa JavaScript, artikel ini sudah memadai

Nota

Watak "-" biasanya hanya mewakili watak biasa dan hanya apabila ia mewakili julat aksara

digunakan sebagai metacharacter. Julat yang diwakili oleh tanda sempang "-" mengikut urutan pengekodan aksara Contohnya, "a-Z", "z-a", dan "a-9" semuanya adalah julat yang menyalahi undang-undang.

[Kes] ​​Kandungan input terhad

Ungkapan biasa JavaScript, artikel ini sudah memadai

Idea pelaksanaan kod:

Tulis HTML, tetapkan kotak teks untuk tahun (tahun) dan bulan (bulan), dan butang pertanyaan.

Dapatkan objek elemen operasi dan sahkan penyerahan borang.

Tahun pengesahan, biasa: /^d{4}/. Sahkan bulan, peraturan biasa: / ( ( 0 ? [ 1 − 9 ] ) ∣ ( 1 [ 012 ] ) ) /.

Kotak teks mendapat fokus dan mengalih keluar warna kotak gesaan. Kotak teks kehilangan fokus, mengalih keluar ruang putih di kedua-dua hujung kandungan input dan mengesahkan.

Pelaksanaan kod

	nbsp;html>
	
	
	<meta>
	<title>限定输入内容</title>
	<style>
	input[type=text]{width: 40px;border-color: #bbb;height: 25px;font-size: 14px;border-radius: 2px;outline: 0;border: #ccc 1px solid;padding: 0 10px;-webkit-transition: box-shadow .5s;margin-bottom: 15px;}
	input[type=text]:hover, input[type=text]:focus,input[type=submit]:hover{border: 1px solid #56b4ef; box-shadow: inset 0 1px 3px rgba(0,0,0,.05),0 0 8px rgba(82,168,236,.6); -webkit-transition: box-shadow .5s;}
	input::-webkit-input-placeholder {color: #999; -webkit-transition: color .5s;}
	input:focus::-webkit-input-placeholder, input:hover::-webkit-input-placeholder {color: #c2c2c2; -webkit-transition: color .5s;}
	input[type=submit]{height: 30px; width: 80px; background: #4393C9; border:1px solid #fff;color: #fff;font:14px bolder; }
	</style>
	
	
	
Salin selepas log masuk
年份  月份 

<script> function checkYear(obj) { if (!obj.value.match(/^\d{4}$/)) { obj.style.borderColor = &#39;red&#39;; result.innerHTML = &#39;输入错误,年份为4位数字表示&#39;; return false; } result.innerHTML = &#39;&#39;; return true; } function checkMonth(obj) { if (!obj.value.match(/^((0?[1-9])|(1[012]))$/)) { obj.style.borderColor = &#39;red&#39;; result.innerHTML = &#39;输入错误,月份为1~12之间&#39;; return false; } result.innerHTML = &#39;&#39;; return true; } var form = document.getElementById(&#39;form&#39;); // <form>元素对象 var result = document.getElementById(&#39;result&#39;); // <p>元素对象 var inputs = document.getElementsByTagName(&#39;input&#39;); // <input>元素集合 form.onsubmit = function() { return checkYear(inputs.year) && checkMonth(inputs.month); }; inputs.year.onfocus = function() { this.style.borderColor = &#39;&#39;; }; inputs.month.onfocus = function() { this.style.borderColor = &#39;&#39;; }; if (!String.prototype.trim) { String.prototype.trim = function() { return this.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, &#39;&#39;); // \uFEFF字节顺序标记;\xA0不换行空白 }; } inputs.year.onblur = function() { this.value = this.value.trim(); checkYear(this); }; inputs.month.onblur = function() { this.value = this.value.trim(); checkMonth(this); }; </script>

Kaedah dalam kelas RegExp

kaedah test(): mengesan sama ada ungkapan biasa sepadan dengan rentetan yang ditentukan.

Ungkapan biasa JavaScript, artikel ini sudah memadai

Apabila perlawanan berjaya, nilai pulangan kaedah test() adalah benar, jika tidak ia mengembalikan palsu.

Mengesan pengubah suai corak objek biasa

Terdapat juga beberapa sifat dalam kelas RegExp untuk mengesan pengubah suai corak yang digunakan oleh semasa regular object , dan tentukan indeks permulaan perlawanan seterusnya, dsb.

Ungkapan biasa JavaScript, artikel ini sudah memadai


Agar pembaca lebih memahami penggunaan atribut ini, perkara berikut akan menunjukkan padanan ruang sebagai contoh.

Ungkapan biasa JavaScript, artikel ini sudah memadai

Kaedah dalam kelas Rentetan

kaedah carian() : boleh mengembalikan kedudukan di mana subrentetan corak yang ditentukan mula-mula muncul dalam rentetan , berbanding dengan Ia lebih berkuasa daripada kaedah indexOf().

Ungkapan biasa JavaScript, artikel ini sudah memadai

  • Parameter kaedah carian() ialah objek biasa Jika objek ungkapan bukan biasa dimasukkan, "RegExp(parameter masuk) baharu akan digunakan )" secara tersirat menukarnya kepada objek ungkapan biasa.
  • Nilai pulangan kaedah carian() selepas padanan yang gagal ialah -1.

kaedah split() : digunakan untuk memisahkan rentetan kepada tatasusunan rentetan berdasarkan pembatas yang ditentukan Tatasusunan rentetan terpecah tidak termasuk pembatas.

Apabila terdapat lebih daripada satu pembatas, objek biasa perlu ditakrifkan untuk menyelesaikan operasi pemisahan rentetan.

Ungkapan biasa JavaScript, artikel ini sudah memadai

  • dipisahkan mengikut "@" dan "." Parameter kaedah
  • split() ialah pembatas yang ditetapkan oleh mod ungkapan biasa dan nilai pulangan ialah hasil pecahan yang disimpan dalam bentuk tatasusunan.

Nota

Apabila rentetan kosong, kaedah split() mengembalikan tatasusunan "[""]" yang mengandungi rentetan kosong , jika rentetan dan pembatas adalah rentetan kosong, tatasusunan kosong "[]" dikembalikan.

Ungkapan biasa JavaScript, artikel ini sudah memadai

  • Apabila menggunakan padanan biasa untuk membelah rentetan, anda juga boleh menentukan bilangan pemisahan rentetan.
  • Apabila bilangan pemisahan rentetan ditentukan, jika nombor yang ditentukan adalah kurang daripada bilangan pemisahan yang memenuhi peraturan dalam rentetan sebenar, hasil pemisahan lain akan diabaikan dalam hasil pemulangan akhir.

Amalan tangan

Pengesahan kekuatan kata laluan

Syarat pengesahan kekuatan kata laluan:

① Panjang

②Panjangnya ialah >6 aksara dan mengandungi satu daripada nombor, huruf atau aksara lain Kekuatan kata laluan adalah "rendah".

③Panjangnya ialah >6 aksara dan mengandungi dua jenis nombor, huruf atau aksara lain Kekuatan kata laluan ialah "sederhana".

④Panjangnya ialah >6 aksara dan mengandungi tiga atau lebih nombor, huruf atau aksara lain Kekuatan kata laluan ialah "Tinggi".

Kelayakan Watak

Kelayakan Watak - Kelayakan

Tanya soalan: Padankan aksara berturut-turut, seperti 6 nombor berturut-turut "458925".

Penyelesaian 1: Objek biasa/dddddd/gi.

Masalah sedia ada: "d" yang berulang tidak mudah dibaca dan menyusahkan untuk ditulis.

Penyelesaian 2: Gunakan penentu kelayakan (?, ,*, { }) untuk melengkapkan pemadanan kejadian berturut-turut bagi watak tertentu. Objek biasa/d{6}/gi.

Ungkapan biasa JavaScript, artikel ini sudah memadai

Kelayakan watak - pemadanan tamak dan malas

Apabila aksara titik (.) digunakan bersama-sama dengan kelayakan, ia boleh memadankan mana-mana aksara dalam yang dinyatakan julat nombor.

  • Contoh: "^hello.*world$".
  • Penerangan: Boleh memadankan rentetan bermula daripada helo dan berakhir di dunia, mengandungi sifar atau lebih aksara arbitrari di antaranya.

Regular menyokong padanan tamak dan padanan malas apabila memadankan mana-mana aksara dalam julat nombor yang ditentukan.

  • Yang dipanggil tamak bermaksud memadankan seberapa banyak aksara yang mungkin, manakala malas bermaksud memadankan sesedikit aksara yang mungkin. Secara lalai, padanan tamak digunakan.
  • Jika anda ingin mencapai pemadanan malas, anda perlu menambah simbol "?" selepas kelayakan sebelumnya.

Ungkapan biasa JavaScript, artikel ini sudah memadai

Watak kurungan

Dalam ungkapan biasa, kandungan yang dilampirkan oleh aksara kurungan "()", Panggilnya "subungkapan".

Ungkapan biasa JavaScript, artikel ini sudah memadai

Fungsi

Ungkapan biasa JavaScript, artikel ini sudah memadai

Kurungan sepadan dengan tangkapan dan memenuhi, dan jika kurungan tidak digunakan, Ia menjadi catch and er

Ungkapan biasa JavaScript, artikel ini sudah memadai

Apabila tidak dikumpulkan, ini bermakna padankan 2 aksara c selepas dikumpulkan, ia bermakna padankan 2 rentetan "bc".

Menangkap dan tidak menangkap

Menangkap: proses menyimpan kandungan yang dipadankan dengan subungkapan ke dalam kawasan cache sistem.

Bukan menangkap: Jangan simpan kandungan padanan subungkapan dalam cache sistem, gunakan (?:x) untuk mencapai ini.

Ungkapan biasa JavaScript, artikel ini sudah memadai

String对象的replace()方法,可直接利用$n(n是大于0的正整数)获取捕获内容,完成对子表达式捕获的内容进行替换的操作。

Ungkapan biasa JavaScript, artikel ini sudah memadai

  • 第1个参数为正则表达式,用于与str字符串进行匹配,将符合规则的内容利用第2个参数设置的内容进行替换。
  • $2表示reg正则表达式中第2个子表达式被捕获的内容“Capture”。
  • $1表示第1个子表达式被捕获的内容“Regular”。
  • 返回值是替换后的新字符串,因此,并不会修改原字符串的内容。

可以使用”(?:x)”的方式实现非捕获匹配

Ungkapan biasa JavaScript, artikel ini sudah memadai

反向引用

在编写正则表达式时,若要在正则表达式中,获取存放在缓存区内的子表达式的捕获内容,则可以使用“\n”(n是大于0的正整数)的方式引用,这个过程就是“反向引用”。

  • “\1”表示第1个子表达式的捕获内容。
  • “\2”表示第2个子表达式的捕获内容,以此类推。

Ungkapan biasa JavaScript, artikel ini sudah memadai

  • “\d”用于匹配0~9之间的任意一个数字。
  • 为其添加圆括号“()”后,即可通过反向引用获取捕获的内容。
  • 因此,最后的匹配结果为333和666。

零宽断言

零宽断言:指的是一种零宽度的子表达式匹配,用于查找子表达式匹配的内容之前或之后是否含有特定的字符集。

分类:分为正向预查和反向预查,但是在JavaScript中仅支持正向预查,即匹配含有或不含有捕获内容之前的数据,匹配的结果中不含捕获的内容。

Ungkapan biasa JavaScript, artikel ini sudah memadai

正则运算符优先级

正则表达式中的运算符有很多。在实际应用时,各种运算符会遵循优先级顺序进行匹配。正则表达式中常用运算符优先级,由高到低的顺序如下表。

Ungkapan biasa JavaScript, artikel ini sudah memadai

【案例】内容查找与替换

Ungkapan biasa JavaScript, artikel ini sudah memadai

代码实现思路

  • 编写HTML,定义两个文本域,一个用于用户输入,另一个用于显示按照要求替换后的过滤内容。
  • 用户输入只要含有bad和任意中文字符,就利用*替换。
  • 查找并替换的内容规则:/(bad)|[\u4e00-\u9fa5]/gi。

代码实现

	nbsp;html>
	
	
	<meta>
	<title>内容查找与替换</title>
	<style>
	p{float:left;}
	input{margin:0 20px;}
	</style>
	
	
	<p>过滤前内容:<br>
	<textarea></textarea>
	<input>
	</p>
	<p>过滤后内容:<br>
	<textarea></textarea>
	</p>
	<script>
	document.getElementById(&#39;btn&#39;).onclick = function () {
	// 定义查找并需要替换的内容规则,[\u4e00-\u9fa5]表示匹配任意中文字符
	var reg = /(bad)|[\u4e00-\u9fa5]/gi;
	var str = document.getElementById(&#39;pre&#39;).value;
	var newstr = str.replace(reg, &#39;*&#39;);
	document.getElementById(&#39;res&#39;).innerHTML = newstr;
	};
	</script>
	
	
Salin selepas log masuk

相关推荐:javascript学习教程

Atas ialah kandungan terperinci Ungkapan biasa JavaScript, artikel ini sudah memadai. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:csdn.net
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan