Query Parameters
Query parameters are key-value pairs appended to a URL to pass optional inputs to a server or client-side application. They are commonly used for filtering, searching, sorting, pagination, and preserving application state in links.
A query string is the part of a URL that appears after the `?` character. It contains one or more parameters written as `key=value` pairs. Multiple parameters are separated with `&`.
For example, in `/products?category=books&page=2`, the query parameters are `category=books` and `page=2`. They provide additional information about the request without changing the path.
Frontend applications often read query parameters to control what data is displayed. A search page may use `?q=laptop`, while a paginated list may use `?page=3&limit=20`.
Browsers and JavaScript provide tools for working with query strings. The `URLSearchParams` API can parse, read, add, update, and remove parameters without manually manipulating strings.
Query parameters should be URL-encoded when they contain spaces or special characters. This ensures the URL remains valid and can be interpreted consistently by browsers and servers.
Key points
- Query parameters appear after `?` in a URL.
- Multiple parameters are separated by `&`.
- They commonly represent filters, search terms, sorting options, and page numbers.
- Parameters are typically optional inputs rather than part of the resource path.
- JavaScript's `URLSearchParams` API simplifies reading and modifying them.
Interview questions
What are query parameters and where do they appear in a URL?
Query parameters are key-value pairs that provide additional information about a request. They appear after the `?` character in a URL. Each parameter is written as `key=value`, and multiple parameters are separated by `&`. They are often used for filtering, searching, sorting, and pagination. They do not change the main path of the resource being requested.
How can you read query parameters in JavaScript?
Modern JavaScript provides the `URLSearchParams` API for working with query strings. You can create an instance from a query string or URL and use methods such as `get`, `set`, `has`, and `delete`. This avoids manual string parsing and handles many edge cases automatically. It is the standard approach in browser-based applications.
Why is URL encoding important for query parameters?
Some characters have special meaning in URLs and cannot be used safely without encoding. Spaces, ampersands, question marks, and other characters may break parsing if they are inserted directly. URL encoding converts such characters into a safe representation. This helps browsers and servers interpret parameter values correctly.
When would you use query parameters instead of path parameters?
Query parameters are appropriate when the input modifies how data is returned rather than identifying a different resource. Examples include search terms, filters, sorting options, and page numbers. Path parameters are generally used when a value identifies a specific resource, such as a user ID. Choosing between them improves URL clarity and consistency.
How do query parameters support pagination?
Pagination parameters allow clients to request a specific subset of data. Common examples include `page`, `offset`, and `limit`. The frontend includes these values in the URL, and the server uses them to determine which records to return. Keeping pagination state in the URL makes links shareable and allows users to reload or bookmark the current view.