Why array + array returns a string?

Question

Why does summing 2 arrays joins everything in a string, concatenating the first and last values:

  let array = [1, 2]

  let array2 = [3, 4]

  let array3 = array + array2

  console.log(array3) // 1,23,4

javascript is dynamically typed and will attempt to coerce any variable to a suitable type for the operation at hand — pilchard, Apr 12 '22 at 22:34
When you try to add them, js reduces them to strings first. `array2.toString()` would result in "3,4". To concatenate arrays you could use the `.concat` [method](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/concat) or you could use the [spread operator](https://stackoverflow.com/questions/43455911/using-es6-spread-to-concat-multiple-arrays) — async await, Apr 12 '22 at 22:36
@pilchard the link refers to another question that is totally different for me, please read both question and note that they have totally different content. Perhaps both question do share a common accepted answer but each one has a totally different approach. If you don't want to answer, you don't have to; but allow others to do it. Same goes for sideshowbarker. I guess you try to help, but actually you don't. — Victor, Apr 12 '22 at 23:54
@Victor I appreciate your concern but at it's heart this is just a coercion question and the linked duplicate covers that. There is even more discussion here [Empty arrays seem to equal true and false at the same time](https://stackoverflow.com/a/43905035/13762301) including links and discussion of the relevant parts of the spec. I did upvote your answer as I felt it was the most concise of the three, but it could at least link to the [docs](https://developer.mozilla.org/en-US/docs/Glossary/Type_coercion) if not the [spec](https://tc39.es/ecma262/#sec-applystringornumericbinaryoperator) — pilchard, Apr 13 '22 at 00:09
I also appreciate that you didn't jump to the conclusion that the OP was actually trying to concat the arrays and just answered the question at face value. — pilchard, Apr 13 '22 at 00:11
@pilchard i appreciate you upvote and adding a link to the docs would be a nice complement. Let's reach a middleground on this: I guess for the sake of simplicity is not bad to answer this question and, besides, add a link to those answer that are related. Also you may consider the level of expertise of the OP, if he is a newbie then, probably a concise answer (with few details) is better than the full explanation. — Victor, Apr 13 '22 at 00:59

Samathingamajig · Accepted Answer · 2022-04-12T22:39:41.580

4

That's just how JavaScript works. Both are objects, there's not a defined thing for + between an Array and an Array, so it does the default thing of converting to String and concatenating them (still as a String).

Use the Array.prototype.concat method to acheive your goal.

let array = [1, 2]

let array2 = [3, 4]

let array3 = array.concat(array2);

console.log(array3) // [1, 2, 3, 4]

Alternatively, you can use the spread operator:

let array = [1, 2]

let array2 = [3, 4]

let array3 = [...array, ...array2];

console.log(array3) // [1, 2, 3, 4]

edited Apr 12 '22 at 22:39

answered Apr 12 '22 at 22:36

Samathingamajig

11,839
3
12
34

The OP didn't mention they were trying to concat them, merely asked why they were concatenated as strings. – pilchard Apr 12 '22 at 22:38

Victor · Answer 2 · 2022-04-13T01:00:41.263

Because the + operator acts diffently according to the type of the given operands.

If both operands are numbers, then a sum if performed.
If one of the operand is not number, then both operands are transformed into string (using .toString) and concatenated.

In your example you may notice that:

array + array2 == array.toString() + array2.toString()

For further information you may read the docs and the spec

score 1 · Answer 3 · answered Apr 12 '22 at 22:38

Javascript tries to be smart and figure out what you are trying to do. An addition sign implies adding two strings, so Javascript goes ahead and converts the arrays to strings first for you. How nice, right?

What you want to do is implement the concat method:

const array1 = ['a', 'b', 'c'];
const array2 = ['d', 'e', 'f'];
const array3 = array1.concat(array2)

Why array + array returns a string?

3 Answers3