Abfragezeichenfolge in Objekt

JavaScriptJavaScriptBeginner
Jetzt üben

This tutorial is from open-source community. Access the source code

💡 Dieser Artikel wurde von AI-Assistenten übersetzt. Um die englische Version anzuzeigen, können Sie hier klicken

Einführung

In diesem Lab werden wir untersuchen, wie man eine Abfragezeichenfolge oder eine URL mithilfe von JavaScript in ein Objekt umwandeln kann. Wir werden die String.prototype.split()-Methode verwenden, um die Parameter aus der URL zu extrahieren, erstellen dann ein Objekt mit dem URLSearchParams-Konstruktor und konvertieren es in ein Array von Schlüssel-Wert-Paaren. Schließlich werden wir Array.prototype.reduce() verwenden, um das Array in ein JavaScript-Objekt umzuwandeln. Dieses Lab wird Ihnen helfen, zu verstehen, wie man in JavaScript Daten aus URLs und Abfragezeichenfolgen manipulieren und extrahieren kann.


Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL javascript(("JavaScript")) -.-> javascript/BasicConceptsGroup(["Basic Concepts"]) javascript(("JavaScript")) -.-> javascript/AdvancedConceptsGroup(["Advanced Concepts"]) javascript(("JavaScript")) -.-> javascript/SecurityGroup(["Security"]) javascript/BasicConceptsGroup -.-> javascript/variables("Variables") javascript/BasicConceptsGroup -.-> javascript/data_types("Data Types") javascript/BasicConceptsGroup -.-> javascript/arith_ops("Arithmetic Operators") javascript/BasicConceptsGroup -.-> javascript/comp_ops("Comparison Operators") javascript/BasicConceptsGroup -.-> javascript/array_methods("Array Methods") javascript/AdvancedConceptsGroup -.-> javascript/higher_funcs("Higher-Order Functions") javascript/AdvancedConceptsGroup -.-> javascript/spread_rest("Spread and Rest Operators") javascript/SecurityGroup -.-> javascript/web_sec("Web Security Basics") subgraph Lab Skills javascript/variables -.-> lab-28565{{"Abfragezeichenfolge in Objekt"}} javascript/data_types -.-> lab-28565{{"Abfragezeichenfolge in Objekt"}} javascript/arith_ops -.-> lab-28565{{"Abfragezeichenfolge in Objekt"}} javascript/comp_ops -.-> lab-28565{{"Abfragezeichenfolge in Objekt"}} javascript/array_methods -.-> lab-28565{{"Abfragezeichenfolge in Objekt"}} javascript/higher_funcs -.-> lab-28565{{"Abfragezeichenfolge in Objekt"}} javascript/spread_rest -.-> lab-28565{{"Abfragezeichenfolge in Objekt"}} javascript/web_sec -.-> lab-28565{{"Abfragezeichenfolge in Objekt"}} end

Umwandeln einer Abfragezeichenfolge in ein Objekt

Um eine Abfragezeichenfolge oder eine URL in ein Objekt umzuwandeln, folgen Sie diesen Schritten:

  1. Öffnen Sie das Terminal/SSH und geben Sie node ein, um mit der Codeausführung zu beginnen.
  2. Verwenden Sie String.prototype.split(), um die Parameter aus der angegebenen url zu extrahieren.
  3. Verwenden Sie den URLSearchParams-Konstruktor, um ein Objekt zu erstellen und es mit dem Spread-Operator (...) in ein Array von Schlüssel-Wert-Paaren zu konvertieren.
  4. Verwenden Sie Array.prototype.reduce(), um das Array von Schlüssel-Wert-Paaren in ein Objekt umzuwandeln.

Hier ist der Code, um die Abfragezeichenfolge umzuwandeln:

const queryStringToObject = (url) =>
  [...new URLSearchParams(url.split("?")[1])].reduce(
    (a, [k, v]) => ((a[k] = v), a),
    {}
  );

Beispielverwendung:

queryStringToObject("https://google.com?page=1&count=10");
// {page: '1', count: '10'}

Zusammenfassung

Herzlichen Glückwunsch! Sie haben das Lab "Abfragezeichenfolge in Objekt" abgeschlossen. Sie können in LabEx weitere Labs absolvieren, um Ihre Fähigkeiten zu verbessern.