Analysieren die Abfragezeichenfolge in JavaScript

1. Dummy-Hyperlink
2. Syntax von parseQuery

In diesem Tutorial sehen wir uns an, wie das Parsen von Abfragezeichenfolgen in JavaScript funktioniert, aber bevor wir fortfahren, werfen wir einen Blick auf den Verlauf und sehen uns an, warum wir diese Abfragezeichenfolgen überhaupt brauchen.

Ein query string ist ein Teil eines Hyperlinks oder einer URL, der direkt nach dem Fragezeichen ? kommt. Es setzt Werte für Variablen, die als Schlüssel oder Parameter bekannt sind, ähnlich einem Python-Dictionary. Es sendet Daten von einer Webseite zur anderen und ruft bestimmte Daten aus der Datenbank oder dem Webserver ab.

Dummy-Hyperlink

www.mysite
    .com  // default.aspx?username=user+1&units=kgs&units=pounds&permission=false

Im obigen Hyperlink bezieht sich dieser Teil auf die Abfrage:

username = user + 1 & units = kgs& units = pounds& permission = false

Übrigens bedeutet Parsen, einen Teil von etwas herauszuholen, und hier sprechen wir von einer Abfragezeichenfolge, was bedeutet, dass dieser Prozess einen Teil unserer Abfragezeichenfolge nimmt und damit arbeitet. Diese geparste Abfragezeichenfolge spielt eine wichtige Rolle beim Verweisen oder Abrufen von Datenanforderungen.

So würde eine geparste Abfrage aussehen:

username = user 1

Sehen wir uns nun ein greifbareres Beispiel an, das zeigt, wie JavaScript die Abfragezeichenfolge des angegebenen Hyperlinks analysiert, der mehrere Testfälle durchläuft. In diesem Beispiel übernimmt unsere Funktion parseQuery den Hyperlink als Argument und spuckt die geparste Abfrage in Form eines JavaScript-Objekts aus.

Syntax von parseQuery

parseQuery(query)

• query: Die spezifische Zeichenfolge, die als Abfrage übergeben wird.

function parseQuery(query) {
  object = {};

  if (query.indexOf('?') != -1) {
    query = query.split('?');
    query = query[1];
  }

  parseQuery = query.split('&');

  for (var i = 0; i < parseQuery.length; i++) {
    pair = parseQuery[i].split('=');
    key = decodeURIComponent(pair[0]);
    if (key.length == 0) continue;
    value = decodeURIComponent(pair[1].replace('+', ' '));

    if (object[key] == undefined)
      object[key] = value;
    else if (object[key] instanceof Array)
      object[key].push(value);
    else
      object[key] = [object[key], value];
  }

  return object;
};

Beginnen wir mit der Erstellung eines leeren Objekts, dann wird unsere Abfrage oder unser Hyperlink von ? getrennt. um die überschüssige URL loszuwerden.

Sobald dies erledigt ist, trennen wir unsere Abfrage von &, um das sogenannte Attribut und seinen Wert in Form einer Liste zu erhalten, die iteriert wird, um Wert und Attribut einzeln zu extrahieren.

Jetzt überprüft das Schlüssel-Wert-Paar einige der Testfälle, und schließlich ersetzen wir vom verbleibenden Wert jedes +-Zeichen durch ein Leerzeichen, das uns einen besser lesbaren Wert gibt.

Gehen wir unsere Testfälle durch:

Fall 1

parseQuery('username=Eren&units=kgs&permission=true');

In diesem Fall übergeben wir eine Abfrage anstelle einer URL username=Eren&units=kgs&permission=true, was passieren wird, dass der erste if-Block übersprungen wird, und da es mehr als ein Schlüssel-Wert-Paar gibt, wird die Abfrage aufgeteilt, und diese Codezeile wird auf Richtigkeit überprüft, da wir keine doppelten Schlüssel haben.

if (object[key] == undefined) object[key] = value;

Ausgabe:

{ 
    username: 'Eren', 
    units: 'kgs', 
    permission: 'true' 
}

Fall 2

parseQuery(
    'http:/www.mysite.com//default.txt?username=David+Rogers&units=kgs&permission=false');

Jetzt verwenden wir den vollständigen Hyperlink

http: /www.mysite.com/ / default.txt ? username = David + Rogers& units =
                                                      kgs& permission = false

als Argument und die unten angegebene if-Bedingung wird True und dieser Block extrahiert die Abfrage aus unserem Hyperlink

if (query.indexOf('?') != -1) {

Ausgabe:

{ 
    username: 'David Rogers', 
    units: 'kgs', 
    permission: 'false' 
}

Fall 3

parseQuery(
    'http:/www.mysite.com//default.txt?username=user1&insect=%D0%B1%D0%B0%D0%B1%D0%BE%D1%87%D0%BA%D0%B0');

Versuchen wir, eine URL einzugeben, die eine verschlüsselte Nachricht enthält.

http: /www.mysite.com/ / default.txt ? username = user1& insect = % D0 % B1 %
    D0 % B0 % D0 % B1 % D0 % BE % D1 % 87 % D0 % BA % D0 % B0

Wir haben die Funktion decodeURIComponent() verwendet, um diese Nachricht zu entschlüsseln.

Ausgabe:

{ 
    username: 'user 1', 
    insect: 'бабочка' 
}

Fall 4

parseQuery(
    'http:/www.mysite.com//default.txt?username=Eren&units=kgs&permission=false&units=pounds');

Schließlich betrachten wir einen Hyperlink, der doppelte Schlüssel enthält

http: /www.mysite.com/ / default.txt ?
    username = Eren& units = kgs& permission = false& units = pounds

für den ersten doppelten Wert unterhalb der Codezeile wird ausgeführt und ein Array erstellt.

else object[key] = [object[key], value];

Danach wird jeder doppelte Eintrag in dieses Array geschoben.

else if (object[key] instanceof Array) object[key].push(value);

Ausgabe:

 {
  username: 'Eren',
  units: [ 'kgs', 'pounds'],
  permission: 'false'
}