Kullanıcı giriş dizesini normal ifadeye dönüştürme

HTML ve JavaScript'te düzenli bir ifade test cihazı tasarlıyorum. Kullanıcı bir normal ifade, bir dize girecek ve radyo düğmesi ile test etmek istediği işlevi (ör. Arama, eşleme, değiştirme vb.) Seçecek ve bu işlev belirtilen bağımsız değişkenlerle çalıştırıldığında program sonuçları görüntüleyecektir. Doğal olarak, ekstra argümanların yerini alacak ek metin kutuları olacaktır.

Benim sorunum dize kullanıcıdan alıp normal bir ifadeye dönüştürmektir. Eğer girdikleri //normal ifade etrafında olmaları gerekmediğini söylersem, gve gibi bayraklar ayarlayamazlar i. Yani //ifadenin etrafında 's olması gerekir , ama bu dizeyi normal ifadeye nasıl dönüştürebilirim? Onun bir dize beri bir değişmez olamaz, ve RegExp yapıcısına //'s olmadan bir dize beri geçemez . Bir regex kullanıcı giriş dizesi yapmak için başka bir yolu var mı? Normal ifadenin dize ve bayrakları //'s ile ayrıştırmak zorunda kalacak daha sonra başka bir şekilde inşa etmek? Onları bir dize girmeli ve sonra bayrakları ayrı ayrı girmeli miyim?

Bir dizeden normal bir ifade oluşturmak için RegExp nesne yapıcısını kullanın:

var re = new RegExp("a|b", "i");
// same as
var re = /a|b/i;

var flags = inputstring.replace(/.*\/([gimy]*)$/, '$1');
var pattern = inputstring.replace(new RegExp('^/(.*?)/'+flags+'$'), '$1');
var regex = new RegExp(pattern, flags);

veya

var match = inputstring.match(new RegExp('^/(.*?)/([gimy]*)$'));
// sanity check here
var regex = new RegExp(match[1], match[2]);

İşte bir astar: str.replace(/[|\\{}()[\]^$+*?.]/g, '\\$&')

Escape-string-regexp NPM modülünden aldım .

Denemek:

escapeStringRegExp.matchOperatorsRe = /[|\\{}()[\]^$+*?.]/g;
function escapeStringRegExp(str) {
    return str.replace(escapeStringRegExp.matchOperatorsRe, '\\$&');
}

console.log(new RegExp(escapeStringRegExp('example.com')));
// => /example\.com/

Etiketli şablon değişmezlerini bayrak desteği ile kullanma:

function str2reg(flags = 'u') {
    return (...args) => new RegExp(escapeStringRegExp(evalTemplate(...args))
        , flags)
}

function evalTemplate(strings, ...values) {
    let i = 0
    return strings.reduce((str, string) => `${str}${string}${
        i < values.length ? values[i++] : ''}`, '')
}

console.log(str2reg()`example.com`)
// => /example\.com/u

JavaScript RegExp nesne yapıcısını kullanın .

var re = new RegExp("\\w+");
re.test("hello");

Bayrakları yapıcıya ikinci bir dize bağımsız değişkeni olarak iletebilirsiniz. Ayrıntılar için belgelere bakın.

Benim durumumda kullanıcı girişi bazen sınırlayıcılar tarafından çevrelenmiş ve bazen değil. bu yüzden başka bir dava ekledim ..

var regParts = inputstring.match(/^\/(.*?)\/([gim]*)$/);
if (regParts) {
    // the parsed pattern had delimiters and modifiers. handle them. 
    var regexp = new RegExp(regParts[1], regParts[2]);
} else {
    // we got pattern string without delimiters
    var regexp = new RegExp(inputstring);
}

Ayrıca özel bayraklar için ayrı onay kutuları veya metin alanı eklemenizi öneririm. Bu şekilde kullanıcının herhangi bir şey eklemesine gerek olmadığı açıktır //. Değiştirme durumunda iki metin alanı sağlayın . Bu hayatınızı daha kolay hale getirecektir.

Neden? Aksi takdirde bazı kullanıcılar ekleyecek, bazıları ise eklemeyecektir //. Ve bazıları sözdizimi hatası verir. Ardından, //'leri soyduktan sonra , kullanıcının istediği gibi olmayan ve kullanıcının bakış açısından garip davranışa yol açan sözdizimsel olarak geçerli bir normal ifade ile karşılaşabilirsiniz.

Bu, dize geçersiz olduğunda veya bayraklar vb. İçermediğinde de çalışır:

function regExpFromString(q) {
  let flags = q.replace(/.*\/([gimuy]*)$/, '$1');
  if (flags === q) flags = '';
  let pattern = (flags ? q.replace(new RegExp('^/(.*?)/' + flags + '$'), '$1') : q);
  try { return new RegExp(pattern, flags); } catch (e) { return null; }
}

console.log(regExpFromString('\\bword\\b'));
console.log(regExpFromString('\/\\bword\\b\/gi'));
            

Eğer varsa gerçekten bir regex için bir dize dönüştürmek istediğiniz, aşağıdaki işlevi kullanmayı deneyin:

function String2Regex(s){return new RegExp(s.match(/\/(.+)\/.*/)[1], s.match(/\/.+\/(.*)/)[1]);}

Şöyle kullanabilirsiniz:

"abc".match(String2Regex("/a/g"))
> ["a"]

Referans olarak, biçimlendirilmiş ve daha modern bir sürüm:

const String2Regex = str => {
  // Main regex
  const main = str.match(/\/(.+)\/.*/)[1]

  // Regex options
  const options = str.match(/\/.+\/(.*)/)[1]

  // Return compiled regex
  return new RegExp(main, options)
}

Daha önceki yanıtlar sayesinde, bu bloklar, metni filtrelemek için bir RegEx'e yapılandırılabilir bir dize uygulamak için genel amaçlı bir çözüm olarak hizmet eder:

var permittedChars = '^a-z0-9 _,.?!@+<>';
permittedChars = '[' + permittedChars + ']';

var flags = 'gi';
var strFilterRegEx = new RegExp(permittedChars, flags);

log.debug ('strFilterRegEx: ' + strFilterRegEx);

strVal = strVal.replace(strFilterRegEx, '');
// this replaces hard code solt:
// strVal = strVal.replace(/[^a-z0-9 _,.?!@+]/ig, '');

Onay kutularını kullanarak bayraklar isteyebilir ve ardından böyle bir şey yapabilirsiniz:

var userInput = formInput;
var flags = '';
if(formGlobalCheckboxChecked) flags += 'g';
if(formCaseICheckboxChecked) flags += 'i';
var reg = new RegExp(userInput, flags);

evalBu sorunu çözmek için kullanıyorum .

Örneğin:

    function regex_exec() {

        // Important! Like @Samuel Faure mentioned, Eval on user input is a crazy security risk, so before use this method, please take care of the security risk. 
        var regex = $("#regex").val();

        // eval()
        var patt = eval(userInput);

        $("#result").val(patt.exec($("#textContent").val()));
    }