Published
Edited
Oct 15, 2021
Insert cell
Insert cell
Insert cell
Insert cell
searchParamsString = new URLSearchParams(
"?search=selection&topic=d3 selection'"
)
Insert cell
searchParamsString.toString()
Insert cell
Insert cell
new URLSearchParams("?search=selection&topic=d3 selection'").toString()
Insert cell
Insert cell
searchParamsObject = new URLSearchParams({ search: 3, topic: "d3" })
Insert cell
searchParamsObject.toString()
Insert cell
Insert cell
Insert cell
Insert cell
// Pass in a sequence of pairs
URLSearchParamsArray = new URLSearchParams([
["search", "selection"],
["topic", "d3"]
])
Insert cell
URLSearchParamsArray.getAll("search")
Insert cell
Insert cell
// Pass in a sequence of pairs
URLSearchParamsMap = new URLSearchParams(
new Map([
["search", "selection"],
["topic", "d3"]
])
)
Insert cell
URLSearchParamsMap.toString()
Insert cell
URLSearchParamsMap.has("topic")
Insert cell
URLSearchParamsMap.set("topic", "vega") // will overwrite current 'topic' ('d3')
Insert cell
URLSearchParamsMap.getAll("topic")
Insert cell
URLSearchParamsMap.get("jules")
Insert cell
URLSearchParamsMap.toString()
Insert cell
Insert cell
## Iterator

`URLSearchParams` supports the [iteratable protocol](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols#the_iterable_protocol) so it directly be used in a `for of` loop.
Insert cell
Insert cell
multipleSameKeySearchParams = new URLSearchParams([
["topic", ["d3"]],
["topic", ["vega"]],
["topic", ["JavaScript"]],
["topic", ["Observable Plot"]]
])
Insert cell
Insert cell
multipleSameKeySearchParams.get("topic")
Insert cell
Insert cell
multipleSameKeySearchParams.getAll("topic")
Insert cell
Insert cell
{
multipleSameKeySearchParams.append("topic", "React");
return multipleSameKeySearchParams.getAll("topic");
}
Insert cell
Insert cell
// multipleSameKeySearchParams.set("topic", "Jules!")
Insert cell
multipleSameKeySearchParams.get("topic")
Insert cell
Insert cell
Insert cell
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more