Rumah hujung hadapan web Soal Jawab bahagian hadapan Cara JavaScript menggunakan ungkapan biasa

Cara JavaScript menggunakan ungkapan biasa

Apr 25, 2023 pm 05:31 PM

Ungkapan biasa ialah corak yang digunakan untuk memadankan rentetan dan boleh digunakan untuk mengesahkan, mencari, menggantikan rentetan, dsb. JavaScript mempunyai sokongan terbina dalam untuk ungkapan biasa Artikel ini akan memperkenalkan cara menggunakan ungkapan biasa dalam JavaScript.

Ungkapan biasa adalah rumit dan mungkin mengelirukan jika anda baru mengenalinya. Tetapi selagi anda memahami sintaks asas dan fungsi biasa, anda boleh menggunakannya untuk menyelesaikan masalah padanan rentetan dan penggantian yang kompleks.

1. Sintaks asas ungkapan biasa

Ungkapan biasa terdiri daripada satu siri aksara dan aksara meta, dan aksara meta digunakan untuk menentukan peraturan padanan. Berikut ialah beberapa aksara meta yang paling asas:

  1. Huruf dan nombor: Anda boleh memasukkan semua huruf dan nombor terus dalam ungkapan biasa untuk memadankan aksara yang sepadan. Sebagai contoh, ungkapan biasa /test/ boleh memadankan rentetan "ujian" dengan tepat.
  2. Metacharacter: Metacharacter ialah watak istimewa dengan makna istimewa. Contohnya, "." dalam ungkapan biasa mewakili sebarang aksara, "^" mewakili permulaan rentetan, dan "$" mewakili penghujung rentetan.
  3. Set aksara: digunakan untuk memadankan mana-mana aksara dalam set aksara. Contohnya, ungkapan biasa /[ab]/ sepadan dengan "a" atau "b".
  4. Kuantifier: digunakan untuk menentukan bilangan atau julat ulangan yang sepadan. Contohnya, ungkapan biasa /a+/ boleh memadankan sebarang bilangan aksara "a" (sekurang-kurangnya satu) dan "a{3}" bermaksud memadankan tiga aksara "a" berturut-turut.

Berikut ialah beberapa contoh ungkapan biasa yang mudah:

kandungan padanan ungkapan
/ujian/ ujian
/.at/ kucing, topi, sat
/[ bc]at/ bat, cat
/[0-9]*/ 1234567890

2 Ungkapan biasa dalam JavaScript

JavaScript mempunyai sokongan terbina dalam untuk ungkapan biasa objek untuk mencipta objek ungkapan biasa, atau anda boleh menggunakan kaedah biasa objek String untuk melakukan padanan rentetan.

  1. Cipta objek ungkapan biasa

Anda boleh menggunakan pembina objek RegExp untuk mencipta objek ungkapan biasa Pembina menerima dua parameter: satu adalah untuk rentetan yang sepadan mod, yang lain ialah rentetan bendera pilihan.

Contohnya:

var pattern = /d+/g; //Gunakan corak literal untuk mencipta objek ungkapan biasa
var pattern2 = new RegExp("d+", "g" ); //Gunakan pembina untuk mencipta objek ungkapan biasa

Dalam contoh di atas, ungkapan biasa "/d+/g" dan rentetan "d+" adalah sama, kedua-duanya menunjukkan padanan satu atau lebih nombor .

  1. Padanan Rentetan

Dalam JavaScript, anda boleh menggunakan kaedah padanan(), cari(), ganti(), dan belah() bagi objek String untuk dilaksanakan padanan rentetan.

kaedah padanan(): Kaedah padanan() mengembalikan tatasusunan yang mengandungi kandungan rentetan yang sepadan dengan ungkapan biasa Jika tiada yang dipadankan, null dikembalikan = "hello world, hello JavaScript";

var pattern = /hello/;

var result = str.match(pattern);
console.log(result);

kaedah carian(): Kaedah carian() mengembalikan kedudukan permulaan rentetan yang sepadan, ia mengembalikan -1 , hello JavaScript";

var pattern = /world/;

var result = str.search(pattern);

console.log(result); // Output 6


replace( ) kaedah: Kaedah replace() digunakan untuk menggantikan kandungan teks yang dipadankan dan mengembalikan rentetan baharu yang diganti. Contohnya:

var str = "hello world, hello JavaScript";

var pattern = /hello/;

var result = str.replace(pattern, "hai");

console .log(result); // Output "hi world, hi JavaScript"


kaedah split(): Kaedah split() membahagikan rentetan kepada tatasusunan rentetan, menggunakan rentetan pembatas yang ditentukan Atau ungkapan biasa ke tentukan kedudukan belah. Contohnya:

var str = "epal,pisang,oren";

var pattern = /[,]/;

var result = str.split(pattern);

console. log (hasil); // Output ["epal", "pisang", "oren"]



Rentetan pengesahan

    Dalam JavaScript, anda boleh menggunakan objek RegExp Kaedah test() menyemak sama ada rentetan mematuhi ungkapan biasa. test() mengembalikan benar atau salah, menunjukkan sama ada rentetan memenuhi keperluan ungkapan biasa. Contohnya:
  1. var pattern = /d+/;
console.log(pattern.test("123")); // Output true

console.log(pattern.test("1a23 " )); // Output benar

3. Aplikasi lanjutan ungkapan biasa

Terdapat banyak penggunaan lanjutan ungkapan biasa, yang boleh mencapai padanan rentetan dan fungsi penggantian yang lebih kompleks. Berikut ialah beberapa aplikasi lanjutan biasa:

Padanan kumpulan

    Gunakan kurungan untuk menunjukkan pengumpulan, contohnya, ungkapan biasa /(d{3})-(d { 3})-(d{4})/ boleh memadankan format nombor telefon seperti "123-456-7890", dengan (d{3}), (d{3}) dan (d{4}) ialah Tiga kumpulan padankan kod kawasan, nombor pusat dan nombor akhiran dalam nombor telefon.
    1. Penegasan lebar sifar

    Penegasan lebar sifar merujuk kepada kedudukan rentetan yang sepadan dan bukannya aksara. Sebagai contoh, ungkapan biasa /cat(?=dog)/ sepadan dengan "kucing" diikuti dengan "anjing" tetapi tidak sepadan dengan "kucing" tidak diikuti dengan "anjing".

    1. Ganti hasil yang sepadan

    Kami boleh menggunakan ruang letak seperti $1, $2, dsb. apabila menggantikan teks untuk mewakili kumpulan pertama dan kedua dalam hasil yang sepadan seterusnya. Contohnya, ungkapan biasa /(d{3})-(d{3})-(d{4})/ dan "123-456-7890" boleh digantikan dengan "($1) $2-$3" untuk mendapatkan Hasilnya ialah "(123) 456-7890".

    4. Kesimpulan

    Ekspresi biasa ialah alat padanan corak yang berkuasa. Belajar menggunakannya untuk menangani pelbagai masalah padanan dan penggantian rentetan. Dalam JavaScript, anda boleh menggunakan kaedah biasa objek RegExp dan objek String untuk melaksanakan operasi ungkapan biasa. Artikel ini memperkenalkan sintaks asas dan aplikasi biasa bagi ungkapan biasa, dan menyediakan beberapa contoh aplikasi lanjutan. Saya harap pembaca dapat memahami penggunaan ungkapan biasa dalam JavaScript melalui artikel ini.

Atas ialah kandungan terperinci Cara JavaScript menggunakan ungkapan biasa. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

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

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

Video Face Swap

Video Face Swap

Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Peranan React dalam HTML: Meningkatkan Pengalaman Pengguna Peranan React dalam HTML: Meningkatkan Pengalaman Pengguna Apr 09, 2025 am 12:11 AM

React menggabungkan JSX dan HTML untuk meningkatkan pengalaman pengguna. 1) JSX membenamkan HTML untuk menjadikan pembangunan lebih intuitif. 2) Mekanisme DOM maya mengoptimumkan prestasi dan mengurangkan operasi DOM. 3) UI pengurusan berasaskan komponen untuk meningkatkan kebolehkerjaan. 4) Pengurusan negeri dan pemprosesan acara meningkatkan interaktiviti.

Komponen React: Membuat unsur -unsur yang boleh diguna semula di HTML Komponen React: Membuat unsur -unsur yang boleh diguna semula di HTML Apr 08, 2025 pm 05:53 PM

Komponen React boleh ditakrifkan oleh fungsi atau kelas, merangkumi logik UI dan menerima data input melalui prop. 1) Tentukan komponen: Gunakan fungsi atau kelas untuk mengembalikan elemen bertindak balas. 2) Rendering Component: React Call Render Kaedah atau Melaksanakan Komponen Fungsi. 3) Komponen multiplexing: Lulus data melalui prop untuk membina UI yang kompleks. Pendekatan kitaran hayat komponen membolehkan logik dilaksanakan pada peringkat yang berbeza, meningkatkan kecekapan pembangunan dan pemeliharaan kod.

React and the Frontend: Membina Pengalaman Interaktif React and the Frontend: Membina Pengalaman Interaktif Apr 11, 2025 am 12:02 AM

React adalah alat pilihan untuk membina pengalaman front-end interaktif. 1) React memudahkan pembangunan UI melalui komponen dan DOM maya. 2) Komponen dibahagikan kepada komponen fungsi dan komponen kelas. Komponen fungsi adalah lebih mudah dan komponen kelas menyediakan lebih banyak kaedah kitaran hayat. 3) Prinsip kerja React bergantung kepada algoritma DOM dan perdamaian maya untuk meningkatkan prestasi. 4) Pengurusan negeri menggunakan useState atau ini. Kaedah kitaran hayat seperti ComponentDidMount digunakan untuk logik tertentu. 5) Penggunaan asas termasuk membuat komponen dan pengurusan negeri, dan penggunaan lanjutan melibatkan cangkuk tersuai dan pengoptimuman prestasi. 6) Kesalahan biasa termasuk kemas kini status yang tidak betul dan isu prestasi, kemahiran debugging termasuk menggunakan reactdevtools dan sangat baik

Apakah batasan sistem kereaktifan Vue 2 berkenaan dengan perubahan array dan objek? Apakah batasan sistem kereaktifan Vue 2 berkenaan dengan perubahan array dan objek? Mar 25, 2025 pm 02:07 PM

Sistem Reaktiviti Vue 2 bergelut dengan tetapan indeks array langsung, pengubahsuaian panjang, dan penambahan/penghapusan harta benda objek. Pemaju boleh menggunakan kaedah mutasi Vue dan vue.set () untuk memastikan kereaktifan.

Apakah faedah menggunakan TypeScript dengan React? Apakah faedah menggunakan TypeScript dengan React? Mar 27, 2025 pm 05:43 PM

TypeScript meningkatkan pembangunan React dengan menyediakan keselamatan jenis, meningkatkan kualiti kod, dan menawarkan sokongan IDE yang lebih baik, dengan itu mengurangkan kesilapan dan meningkatkan kebolehkerjaan.

Bagaimanakah anda boleh menggunakan UserEducer untuk Pengurusan Negeri Kompleks? Bagaimanakah anda boleh menggunakan UserEducer untuk Pengurusan Negeri Kompleks? Mar 26, 2025 pm 06:29 PM

Artikel ini menerangkan menggunakan UserEducer untuk Pengurusan Negeri Kompleks dalam React, memperincikan manfaatnya ke atas UseState dan bagaimana untuk mengintegrasikannya dengan useeffect untuk kesan sampingan.

Apakah komponen berfungsi dalam vue.js? Bilakah mereka berguna? Apakah komponen berfungsi dalam vue.js? Bilakah mereka berguna? Mar 25, 2025 pm 01:54 PM

Komponen fungsional dalam vue.js adalah cangkuk kitaran hidup, ringan, dan kekurangan kitaran, sesuai untuk memberikan data tulen dan mengoptimumkan prestasi. Mereka berbeza daripada komponen yang berkesudahan dengan tidak mempunyai keadaan atau kereaktifan, menggunakan fungsi render secara langsung, a

Bagaimana anda memastikan bahawa komponen React anda boleh diakses? Alat apa yang boleh anda gunakan? Bagaimana anda memastikan bahawa komponen React anda boleh diakses? Alat apa yang boleh anda gunakan? Mar 27, 2025 pm 05:41 PM

Artikel ini membincangkan strategi dan alat untuk memastikan komponen React boleh diakses, memberi tumpuan kepada HTML semantik, atribut ARIA, navigasi papan kekunci, dan kontras warna. Ia mengesyorkan menggunakan alat seperti ESLINT-PLUGIN-JSX-A11Y dan AXE-CORE untuk TESTI

See all articles