Why is [1,2] + [3,4] = “1,23,4” in JavaScript?

by

The + operator is not defined for arrays.

What happens is that Javascript converts arrays into strings and concatenates those.

 

Update

Since this question and consequently my answer is getting a lot of attention I felt it would be useful and relevant to have an overview about how the + operator behaves in general also.

So, here it goes.

Excluding E4X and implementation-specific stuff, Javascript (as of ES5) has 6 built-in data types:

  1. Undefined
  2. Null
  3. Boolean
  4. Number
  5. String
  6. Object

Note that although typeof somewhat confusingly returns object for Null and function for callable Objects, Null is actually not an Object and strictly speaking, in specification-conforming Javascript implementations all functions are considered to be Objects.

That’s right – Javascript has no primitive arrays as such; only instances of an Object called Array with some syntactic sugar to ease the pain.

Adding more to the confusion, wrapper entities such as new Number(5), new Boolean(true) and new String("abc") are all of object type, not numbers, booleans or strings as one might expect. Nevertheless for arithmetic operators Number and Boolean behave as numbers.

Easy, huh? With all that out of the way, we can move on to the overview itself.

Different result types of + by operand types

            || undefined | null   | boolean | number | string | object |
=========================================================================
 undefined  || number    | number | number  | number | string | string | 
 null       || number    | number | number  | number | string | string | 
 boolean    || number    | number | number  | number | string | string | 
 number     || number    | number | number  | number | string | string | 
 string     || string    | string | string  | string | string | string | 
 object     || string    | string | string  | string | string | string |

* applies to Chrome13, FF6, Opera11 and IE9. Checking other browsers and versions is left as an exercise for the reader.

Note: As pointed out by CMS, for certain cases of objects such as Number, Boolean and custom ones the + operator doesn’t necessarily produce a string result. It can vary depending on the implementation of object to primitive conversion. For example var o = { valueOf:function () { return 4; } }; evaluating o + 2; produces 6, a number, evaluating o + '2' produces '42', a string.

To see how the overview table was generated visit http://jsfiddle.net/1obxuc7m/

More Related Contents:

  1. How to extend an existing JavaScript array with another array, without creating a new array
  2. How to get character array from a string?
  3. How to check if a string contains text from an array of substrings in JavaScript?
  4. How to find if an array contains a specific string in JavaScript/jQuery?
  5. Convert string with commas to array
  6. How can I split a string into segments of n characters?
  7. Most efficient way to concatenate strings in JavaScript?
  8. What’s the best way to do string building/concatenation in JavaScript?
  9. What does ${} (dollar sign and curly braces) mean in a string in JavaScript?
  10. How to build/concatenate strings in JavaScript?
  11. is the + operator less performant than StringBuffer.append()
  12. How to convert array into string without comma and separated by space in javascript without concatenation?
  13. How to sort an array based on the length of each element?
  14. How to check if a string array contains one string in JavaScript? [duplicate]
  15. How to convert hex string into a bytes array, and a bytes array in the hex string?
  16. Convert javascript array to string
  17. Remove empty strings from array while keeping record Without Loop?
  18. Replace string in javascript array
  19. Trying to capitalize the first character in array of strings, why this is not working?
  20. Remove occurrences of duplicate words in a string
  21. String split returns an array with more elements than expected (empty elements)
  22. How can I get a character array from a string?
  23. javascript – Convert array to string while preserving brackets
  24. How do I check if an array includes a value in JavaScript?
  25. Is there a built in way to convert a comma-separated string to an array?
  26. Remove last item from array
  27. Using JavaScript to perform text matches with/without accented characters
  28. Filter strings in Array based on content (filter search value)
  29. Replacing accented characters with plain ascii ones [duplicate]
  30. Lodash create collection from duplicate object keys

Leave a Comment