Wie kann ich mehrere Vorkommen mit einer Regex in JavaScript abgleichen, ähnlich wie bei PHP's preg_match_all()?

Question

Ich versuche, url-codierte Zeichenfolgen zu analysieren, die aus Schlüssel=Wert-Paaren bestehen, die entweder durch & o & .

Im Folgenden wird nur das erste Vorkommen abgeglichen, wobei die Schlüssel und Werte in separate Ergebniselemente aufgeteilt werden:

var result = mystring.match(/(?:&|&)?([^=]+)=([^&]+)/)

Die Ergebnisse für die Zeichenfolge '1111342=Adam%20Franco&348572=Bob%20Jones' wären:

['1111342', 'Adam%20Franco']

Mit dem globalen Flag 'g' werden alle Vorkommen abgeglichen, aber nur die vollständig übereinstimmenden Teilstrings zurückgegeben, nicht die getrennten Schlüssel und Werte:

var result = mystring.match(/(?:&|&)?([^=]+)=([^&]+)/g)

Die Ergebnisse für die Zeichenfolge '1111342=Adam%20Franco&348572=Bob%20Jones' wären:

['1111342=Adam%20Franco', '&348572=Bob%20Jones']

Während ich die Zeichenkette aufteilen könnte & und jedes Schlüssel/Wert-Paar einzeln aufschlüsseln, gibt es eine Möglichkeit, mit der JavaScript-Unterstützung für reguläre Ausdrücke auf mehrere Vorkommen des Musters /(?:&|&)?([^=]+)=([^&]+)/ ähnlich wie PHPs preg_match_all() Funktion?

Ich suche nach einer Möglichkeit, Ergebnisse zu erhalten, bei denen die Unterübereinstimmungen getrennt sind:

[['1111342', '348572'], ['Adam%20Franco', 'Bob%20Jones']]

o

[['1111342', 'Adam%20Franco'], ['348572', 'Bob%20Jones']]

Answer 1

Aus den Kommentaren entnommen

Anmerkung 2020: Anstatt Regex zu verwenden, haben wir jetzt URLSearchParams die all dies für uns erledigt, so dass kein benutzerdefinierter Code, geschweige denn Regex, mehr erforderlich ist.

- Mike 'Pomax' Kamermans

Die Browserunterstützung ist hier aufgelistet https://caniuse.com/#feat=urlsearchparams

---

Ich würde eine alternative Regex vorschlagen, die Untergruppen verwendet, um Name und Wert der Parameter einzeln zu erfassen und re.exec() :

function getUrlParams(url) {
  var re = /(?:\?|&(?:amp;)?)([^=&#]+)(?:=?([^&#]*))/g,
      match, params = {},
      decode = function (s) {return decodeURIComponent(s.replace(/\+/g, " "));};

  if (typeof url == "undefined") url = document.location.href;

  while (match = re.exec(url)) {
    params[decode(match[1])] = decode(match[2]);
  }
  return params;
}

var result = getUrlParams("http://maps.google.de/maps?f=q&source=s_q&hl=de&geocode=&q=Frankfurt+am+Main&sll=50.106047,8.679886&sspn=0.370369,0.833588&ie=UTF8&ll=50.116616,8.680573&spn=0.35972,0.833588&z=11&iwloc=addr");

result ist ein Objekt:

{
  f: "q"
  geocode: ""
  hl: "de"
  ie: "UTF8"
  iwloc: "addr"
  ll: "50.116616,8.680573"
  q: "Frankfurt am Main"
  sll: "50.106047,8.679886"
  source: "s\_q"
  spn: "0.35972,0.833588"
  sspn: "0.370369,0.833588"
  z: "11"
}

Die Regex setzt sich wie folgt zusammen:

(?:            # non-capturing group
  \\?|&         #   "?" or "&"
  (?:amp;)?    #   (allow "&", for wrongly HTML-encoded URLs)
)              # end non-capturing group
(              # group 1
  \[^=&#\]+      #   any character except "=", "&" or "#"; at least once
)              # end group 1 - this will be the parameter's name
(?:            # non-capturing group
  =?           #   an "=", optional
  (            #   group 2
    \[^&#\]\*     #     any character except "&" or "#"; any number of times
  )            #   end group 2 - this will be the parameter's value
)              # end non-capturing group

Answer 2

Für eine globale Suche müssen Sie den Schalter 'g' verwenden

var result = mystring.match(/(&|&)?([^=]+)=([^&]+)/g)

Answer 3

2020 bearbeiten

Utilice URLSearchParams da für diese Aufgabe kein eigener Code mehr erforderlich ist. Die Browser können dies mit einem einzigen Konstruktor für Sie erledigen:

const str = "1111342=Adam%20Franco&348572=Bob%20Jones";
const data = new URLSearchParams(str);
for (pair of data) console.log(pair)

ergibt

Array [ "1111342", "Adam Franco" ]
Array [ "348572", "Bob Jones" ]

Es gibt also keinen Grund mehr, dafür Regex zu verwenden.

Ursprüngliche Antwort

Wenn Sie sich nicht auf den "blinden Abgleich" verlassen wollen, der mit der Ausführung von exec Stil-Matching, JavaScript kommt mit Match-All-Funktionalität eingebaut, aber es ist Teil der replace Funktionsaufruf, wenn ein "Was tun mit den Erfassungsgruppen" verwendet wird Bearbeitungsfunktion :

var data = {};

var getKeyValue = function(fullPattern, group1, group2, group3) {
  data[group2] = group3;
};

mystring.replace(/(?:&|&)?([^=]+)=([^&]+)/g, getKeyValue);

erledigt.

Anstatt die Funktion zur Behandlung von Erfassungsgruppen zu verwenden, um tatsächlich Ersetzungszeichenfolgen zurückzugeben (bei der Ersetzungsbehandlung ist das erste Argument die vollständige Musterübereinstimmung, und die nachfolgenden Argumente sind einzelne Erfassungsgruppen), nehmen wir einfach die Erfassungen der Gruppen 2 und 3 und zwischenspeichern dieses Paar.

Anstatt also komplizierte Parsing-Funktionen zu schreiben, sollten Sie sich daran erinnern, dass die Funktion "matchAll" in JavaScript einfach "replace" mit einer Ersetzungsfunktion ist, und dass die Mustererkennung sehr effizient ist.

Answer 4

Für die Erfassung von Gruppen verwende ich gewöhnlich preg_match_all in PHP und ich habe versucht, seine Funktionalität hier zu replizieren:

<script>

// Return all pattern matches with captured groups
RegExp.prototype.execAll = function(string) {
    var match = null;
    var matches = new Array();
    while (match = this.exec(string)) {
        var matchArray = [];
        for (i in match) {
            if (parseInt(i) == i) {
                matchArray.push(match[i]);
            }
        }
        matches.push(matchArray);
    }
    return matches;
}

// Example
var someTxt = 'abc123 def456 ghi890';
var results = /[a-z]+(\d+)/g.execAll(someTxt);

// Output
[["abc123", "123"],
 ["def456", "456"],
 ["ghi890", "890"]]

</script>

Answer 5

Stellen Sie die g Modifikator für eine globale Übereinstimmung:

/…/g