Join Map values into single string

Question

I have the following code:

let urls = new Map<string, any[]>();
urls.set("1", ["param=1", "param2=2", "params3=3"]);
urls.set("2", ["param4=4", "param5=5"]);


function getUrl(): string {
  let _tmp = []; 
  urls.forEach((e) => { 
    _tmp.push(e.join("&"));
  });

  return _tmp.join("&");

}

getUrl();

As result I need to get one complete string: param=1&param2=2&params3=3&param4=4&param5=5

I dont like temprorary variable let _tmp = []; , how to improve this?

What's the problem with the current approach? You can do `[...urls.values()].flat().join("&")` but is it really better? — VLAZ, Jul 14 '20 at 11:58
Don't forget to escape all of the values otherwise the resulting URL might be invalid given certain characters. You'd be better of using [URLSearchParams.append](https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams/append). — Jiří Pospíšil, Jul 14 '20 at 12:06

Krzysztof Kaczyński · Accepted Answer · 2020-07-14T12:30:20.810

I think this should work for you ;)

let urls = new Map();
urls.set("1", ["param=1", "param2=2", "params3=3"]);
urls.set("2", ["param4=4", "param5=5"]);
let result = Array.from(urls.values()).map(arr => arr.join('&')).join('&');
console.log(result);

You can also achieve this a bit easier using .flat, but then you have to add es2019 to lib section of tsconfig.json, because .falt is not in the official specification. More abut this you can read here: Typescript flatMap, flat, flatten doesn't exist on type any[]

Array.from(urls.values()).flat().join('&')

Yevhen Horbunkov · Answer 2 · 2022-02-01T16:44:57.170

2

Is that what you need?

const urls = new Map()
urls.set("1", ["param=1", "param2=2", "params3=3"])
urls.set("2", ["param4=4", "param5=5"])

const result = [...urls.values()].flat().join('&')
    
console.log(result)

edited Feb 01 '22 at 16:44

answered Jul 14 '20 at 12:06

Yevhen Horbunkov

14,965
3
20
42

Property 'flat' does not exist on type 'any[][]' – Jul 14 '20 at 12:07
@CoverBase sounds like TS is not targetting ES2019. – VLAZ Jul 14 '20 at 12:08
The same problem – Jul 14 '20 at 12:11
@CoverBase : seems to work [like that](https://codepen.io/ygorbunkov/pen/dyGqYxd?editors=0011) – Yevhen Horbunkov Jul 14 '20 at 12:13
1

@CoverBase because `.flat` is not in official specification. You can try my answer if you do not want to add `.flat` && `.flatMap` to your `tsconfig.json` dependencies – Krzysztof Kaczyński Jul 14 '20 at 12:18

score 0 · Answer 3 · answered Jul 14 '20 at 12:08

If you really need to use Map of arrays, then following will work:

let urls = new Map<string, any[]>();
urls.set("1", ["param=1", "param2=2", "params3=3"]);
urls.set("2", ["param4=4", "param5=5"]);

function getUrl(): string {
    const sep = '&';
    return Array.from(urls.values())
        .map((params) => {
        return params.join(sep)
    })
    .join(sep);
}

getUrl();

Mr. Polywhirl · Answer 4 · 2020-07-14T12:08:09.397

-1

You can map the outer values and inside that, you can map the inner values while joining.

let urls = {
  '1': [ 'param=1', 'param2=2', 'params3=3' ],
  '2': [ 'param4=4', 'param5=5' ]
}

function getUrl() {
  return Object.values(urls).map(values => values.join('&')).join('&')
}

console.log(getUrl())

Here is the TypeScript equivalent:

let urls = new Map<string, any[]>();
urls.set("1", ["param=1", "param2=2", "params3=3"]);
urls.set("2", ["param4=4", "param5=5"]);


function getUrl(): string {
    return Array.from(urls.values()).map(values => values.join('&')).join('&')
}

console.log(getUrl())

edited Jul 14 '20 at 12:08

answered Jul 14 '20 at 11:59

Mr. Polywhirl

42,981
12
84
132

@Karan `flatMap` is not widely supported. Also, it doesn't matter, because we know it's only 2 levels. – Mr. Polywhirl Jul 14 '20 at 12:01
@Mr.Polywhirl it's supported in environments that support Map objects. – VLAZ Jul 14 '20 at 12:01
1

@Karan and instead of `.flatMap(x => x)` you can also use `.flat()` – VLAZ Jul 14 '20 at 12:01

Join Map values into single string

4 Answers4