The URLSearchParams can takes an init value as argument for its constructor containing the following:

One of:

• A string, which will be parsed from application/x-www-form-urlencoded format. A leading '?' character is ignored.

• A literal sequence of name-value string pairs, or any object — such as a FormData object — with an iterator that produces a sequence of string pairs. Note that File entries will be serialized as [object File] rather than as their filename (as they would in an application/x-www-form-urlencoded form).

• A record of string keys and string values.

In your case the second one seems to work the best and can be done like this:

const searchParams = new URLSearchParams([['foo', 'bar'],['foo', 'baz'],['foo', 'qux']])

console.log(searchParams.toString())

If you want to deal with objects, you can create your own structure and use a function to create the wanted data

For example :

const params = [
  {name: "foo", values: ["bar", "baz", "qux"]},
  {name: "bar", values: ["foo", "foo2", "foo3"]},
]

const initParams = (params) => params.reduce((acc, curr) => {
  const arr = curr.values.map(x => [curr.name, x])
  return acc.concat(arr)
}, [])

const searchParams = new URLSearchParams(initParams(params))

console.log(searchParams.toString())

I would introduce a function to build the thing you need (URLSearchParams) from the structure you want (an object containing strings or arrays of strings), pushing the "heavy" details down below an interface you own. A simple implementation would just use .append as appropriate:

// For TypeScript (e.g. Angular) users:
// function createSearchParams(params: { [key: string]: string | string[] }): URLSearchParams {
function createSearchParams(params) {
  const searchParams = new URLSearchParams();
  Object.entries(params).forEach(([key, values]) => {
    if (Array.isArray(values)) {
      values.forEach((value) => {
        searchParams.append(key, value);
      });
    } else {
      searchParams.append(key, values);
    }
  });
  return searchParams;
}

console.log(createSearchParams({
  foo: ["bar", "baz"],
  hello: "world",
}).toString());

This provides an abstraction, so if you decide you'd rather use the init approach under the hood, you can do so, e.g.:

function createSearchParams(params) {
  return new URLSearchParams(Object.entries(params).flatMap(([key, values]) => Array.isArray(values) ? values.map((value) => [key, value]) : [[key, values]]));

}

console.log(createSearchParams({
  foo: ["bar", "baz"],
  hello: "world",
}).toString());

All of your tests will continue to pass, you don't have to change the consuming code. This is much neater than defining a function to convert the structure you want to the thing URLSearchParams needs, as shown in RenaudC5's answer.