Bagaimanakah Saya Boleh Membuat Ungkapan Biasa Secara Dinamik dengan Pembolehubah dalam JavaScript?

Ungkapan Biasa Dinamik dengan Pembolehubah dalam JavaScript

Ekspresi biasa JavaScript menyediakan alat yang berkuasa untuk padanan dan manipulasi corak. Walau bagaimanapun, memasukkan pembolehubah ke dalam corak ini boleh menjadi satu cabaran.

Pertimbangkan coretan kod berikut:

function(input) {
    var testVar = input;
    string = ...
    string.replace(/ReGeX + testVar + ReGeX/, "replacement")
}

Kod ini cuba menggantikan semua kejadian corak tertentu dalam rentetan dengan rentetan yang disediakan rentetan gantian. Walau bagaimanapun, ia akan gagal, kerana anda tidak boleh menggabungkan pembolehubah secara langsung dalam ungkapan biasa.

Penyelesaian: Menggunakan Rentetan Templat

Dalam JavaScript ES6, anda boleh menggunakan rentetan templat untuk mencipta ungkapan biasa secara dinamik dengan pembolehubah. Begini cara anda melakukannya:

const regex = new RegExp(`ReGeX${testVar}ReGeX`);
...
string.replace(regex, "replacement");

Dalam contoh ini, pembina RegExp menerima rentetan templat sebagai hujah pertama. Rentetan templat mengandungi corak ungkapan biasa asal dengan pembolehubah interpolasi testVar. Tanda belakang (``) menunjukkan rentetan templat.

ES6 lwn. Pra-ES6

Sebelum ES6, anda perlu menggunakan kaedah yang lebih bertele-tele untuk mencapai perkara yang sama hasil:

var regex = new RegExp("ReGeX" + testVar + "ReGeX");
...
string.replace(regex, "replacement");

Sintaks yang lebih lama masih berfungsi, tetapi kaedah rentetan templat lebih disukai kerana kesederhanaannya dan kebolehbacaan.

Awas: Melarikan Diri Pembolehubah

Adalah penting untuk ambil perhatian bahawa jika pembolehubah yang anda masukkan mempunyai potensi kandungan berniat jahat (cth., input pengguna), anda harus melarikan diri ia untuk mengelakkan serangan suntikan. Fungsi escape() atau encodeURIComponent() boleh digunakan untuk melarikan diri.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Membuat Ungkapan Biasa Secara Dinamik dengan Pembolehubah dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!