javascripturlsearchparams

what is different of set vs append

In Javascript, URLSearchParams Is it different "set" between "append"?

const test = new URLSearchParams();
test.append("name", "Harry Potter");

const test = new URLSearchParams();
test.set("name", "Harry Potter");

^ different?

Solution

  • The difference becomes easy to see when you call the methods twice. With append, both values are included in the URL, while with set, any present value will be overridden.

    const url = new URLSearchParams()
url.append("name", "Harry Potter")
url.append("name", "Hermione Granger")
url.toString() // "name=Harry+Potter&name=Hermione+Granger"

    const url = new URLSearchParams()
url.set("name", "Harry Potter")
url.set("name", "Hermione Granger")
url.toString() // "name=Hermione+Granger"