Konwertowanie ciągu wejściowego użytkownika na wyrażenie regularne

Projektuję tester wyrażeń regularnych w HTML i JavaScript. Użytkownik wprowadzi wyrażenie regularne, ciąg znaków i wybierze funkcję, którą chce przetestować (np. Wyszukaj, dopasuj, zamień itp.) Przyciskiem radiowym, a program wyświetli wyniki, gdy funkcja ta zostanie uruchomiona z podanymi argumentami. Oczywiście będą dodatkowe pola tekstowe do zastąpienia dodatkowych argumentów i tak dalej.

Moim problemem jest pobranie ciągu od użytkownika i przekształcenie go w wyrażenie regularne. Jeśli powiem, że nie muszą mieć //przedrostka, do którego wchodzą, to nie mogą ustawiać flag, takich jak gi i. Muszą więc mieć //wokół wyrażenia, ale jak mogę przekonwertować ten ciąg na wyrażenie regularne? Nie może być literałem, ponieważ jest łańcuchem i nie mogę przekazać go konstruktorowi RegExp, ponieważ nie jest łańcuchem bez //liter. Czy istnieje inny sposób przekształcenia ciągu wejściowego użytkownika w wyrażenie regularne? Czy będę musiał przeanalizować ciąg i flagi wyrażenia regularnego z literami //„s”, a następnie skonstruować go w inny sposób? Czy powinienem je wprowadzić ciąg, a następnie osobno wprowadzić flagi?

Użyj konstruktora obiektów RegExp, aby utworzyć wyrażenie regularne z łańcucha:

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);

lub

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

Oto jedna linijka: str.replace(/[|\\{}()[\]^$+*?.]/g, '\\$&')

Mam go z modułu NPM „ escape-string-regexp” .

Wypróbowanie:

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

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

Używanie otagowanych literałów szablonów z obsługą flag:

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

Użyj konstruktora obiektów JavaScript RegExp .

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

Możesz przekazać flagi jako drugi argument ciągu do konstruktora. Szczegółowe informacje można znaleźć w dokumentacji.

W moim przypadku dane wprowadzane przez użytkownika były czasem otoczone ogranicznikami, a czasem nie. dlatego dodałem inny przypadek ..

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);
}

Sugeruję również dodanie osobnych pól wyboru lub pola tekstowego dla specjalnych flag. W ten sposób jasne jest, że użytkownik nie musi dodawać żadnych //. W przypadku zamiany podaj dwa pola tekstowe. Ułatwi ci to życie.

Dlaczego? Ponieważ w przeciwnym razie niektórzy użytkownicy dodadzą //, a inni nie. A niektóre popełniają błąd składniowy. Następnie, po usunięciu //'s, możesz skończyć z poprawnym składniowo wyrażeniem regularnym, który nie jest podobny do zamierzonego przez użytkownika, co prowadzi do dziwnych zachowań (z perspektywy użytkownika).

Działa to również wtedy, gdy ciąg jest nieprawidłowy lub nie zawiera flag itp .:

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'));
            

Jeśli naprawdę chcesz przekonwertować ciąg na wyrażenie regularne, spróbuj użyć następującej funkcji:

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

Możesz go używać w następujący sposób:

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

Dla odniesienia, oto sformatowana i bardziej nowoczesna wersja:

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)
}

Dzięki wcześniejszym odpowiedziom bloki te służą również jako rozwiązanie ogólnego zastosowania do stosowania ciągów konfigurowalnych w RegEx .. do filtrowania tekstu:

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, '');

Możesz poprosić o flagi za pomocą pól wyboru, a następnie zrobić coś takiego:

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

Używam evalaby rozwiązać ten problem.

Na przykład:

    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()));
    }