Why does String() flatten an Array in JS?

Question

I was surprised to discover flattening behavior of String constructor when applied to an Array.

Why does this work. And is this a good way to flatten an Array?

Tested to same results on Mac Chrome, Safari, Firefox.

String(['a', 'b', ['c', 'd', ['e', 'f']]])

=> "a,b,c,d,e,f"

It doesn't flatten, then the result would be ['a','b','c','d','e','f'] or the desired result "abcdef" — Pavlo
– Pavlo, Commented Feb 14, 2019 at 17:31
its not a good way to flatten an array. what if one of the strings included a comma? — Daniel A. White
– Daniel A. White, Commented Feb 14, 2019 at 17:32
Why not use array.flat when it's already supported in most of major browser — Code Maniac
– Code Maniac, Commented Feb 14, 2019 at 17:34
alert(String(['a', 'b', ['c', 'd', ['e', {erm:'notsogood'}]]])); Not a good way. Are you assuming all arrays are going to be characters? — JGFMK
– JGFMK, Commented Feb 14, 2019 at 17:36

Jonas Wilms · Accepted Answer · 2019-02-14 17:36:11Z

6

Because converting an array to a string will call .toString which is basically the same as calling .join(), which will call .toString onto all elements in the array, and then delemit the result with a comma. Therefore the arrays get recursively joined to a string, the result looks flattened as there is no indicator for the start or end of the array. Here is the conversion step by step:

 [[1, 2, 3], [1, 2, 3]].toString()
 [1, 2, 3].toString() + "," + [1, 2, 3].toString()
 (1 + "," + 2 + "," + 3) + "," + (1 + "," + 2 + "," + 3)
 "1,2,3" + "1,2,3"
 "1,2,3,1,2,3"

answered Feb 14, 2019 at 17:36

Jonas Wilms

139k20 gold badges164 silver badges164 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Alberti Buonarroti Over a year ago

This is correct. Array.prototye.toString() internally calls Array.prototype.join(). You can read about details here

Daniel A. White · Accepted Answer · 2019-02-14 17:33:56Z

4

It calls Array.prototype.toString - that is all.

answered Feb 14, 2019 at 17:33

Daniel A. White

192k49 gold badges389 silver badges473 bronze badges

1 Comment

michaeljsalo Over a year ago

The source you link to doesn't mention the recursive behavior.

Treble Snake · Accepted Answer · 2019-02-14 17:36:32Z

1

It doesn't flattern an array, it makes a string out of an array. For better options check out Array.flat or, for example, some libraries like lodash flattern() (or Underscore or Rambda).

answered Feb 14, 2019 at 17:36

Treble Snake

2752 silver badges8 bronze badges

Comments

Nino Filiu · Accepted Answer · 2019-02-14 17:38:28Z

1

It is not the only way to convert an array into a string. Often JSON.stringify is preferred:

const arr = [1,[2,[3]]];
console.log(JSON.stringify(arr));

The reason why it seems to 'flatten' the list is that it String is being called recursively on the whole array:

const arr = [1,[2,[3]]];

console.log(
  String(arr)
);
console.log(
  String(arr[0]),
  '+ , +',
  String(arr[1])
);
console.log(
  String(arr[0]),
  '+ , +',
  String(arr[1][0]),
  '+ , +',
  String(arr[1][1])
);

answered Feb 14, 2019 at 17:38

Nino Filiu

18.9k11 gold badges65 silver badges97 bronze badges

Collectives™ on Stack Overflow

Why does String() flatten an Array in JS?

4 Answers 4

1 Comment

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related