Javascript Question posted in
A very good W3school tutorial can be found here.

Can anyone explain this Javascript anomaly with the Map function?

If I enter the following code into the JavaScript console, it returns the number 1310, but why?

console.log(131+"".split(',').map(Number));

I’m adding "" to 131 to convert it to a string, then using the split function to convert that string into an array, and the map function to make sure the values in the array are Numbers.

I’m not sure where the 0 is coming from after the 131, can anyone explain this?

Tags:

3

Answers


  1. 0

    If you use 131 + "".split(",").map(Number) you are adding "".split(",").map(Number) to 131.
    You need to use (131 + "").split(",").map(Number) for your expected outcome.

    Login or Signup to reply.
  2. 0

    To understand it better, break down of what the script you provided does:

    console.log(131+"".split(',').map(Number));

    Removing console.log makes following:

    131+"".split(',').map(Number)

    Evaluation happens firstly on 131, then on "".split(',').map(Number), essentially making it equivalent to

    (131) + ("".split(',').map(Number))

    (131) is just a number 131. Looking at "".split(',').map(Number), going from the leftmost:

    "".split(',')

    Will just return ['']

    [''].map(Number)

    Will essentially be equivalent to

    [ Number('') ]

    Since Number('') is 0, the result is [0]. Coming back:

    (131) + ([0])

    Is just 1310. There you go.

    Login or Signup to reply.
  3. 0

    The member accessor . has higher precedence than +

    const obj = { foo: 41 };

console.log( 1 + obj.foo );   // 42
console.log( 1 + (obj.foo) ); // 42
console.log( (1 + obj).foo ); // undefined

    Thus in 131+"".split(',').map(Number) the order of execution is (slightly abbreviated to focus on the important parts):

        131 + "".split(',') .map(Number)
//      ^ ^^^^^^^^^^^^^  ^^^^^^^^^^^ 
//      3       1             2

    1. "".split(',') – split the empty string using a single comma. This results in [ "" ] (see The confusion about the split() function of JavaScript with an empty string):

      console.log( "".split(',') ); // [ "" ]

    2. [ "" ].map(Number) – the Number function is applied to each member of the array. Since there the array after the split has a single empty string, it results in [ 0 ] because Number("") is 0 (see Number called using empty string, null, or undefined):

      console.log( Number("") );             // 0
console.log( [ "" ].map(Number) ); // [ 0 ]

    3. 131 + [ 0 ] – adding a number and an array. This will first type coerce the array into a primitive then based on what kind of primitive it is (string or number) it will perform either numeric addition with 131 or string concatenation (coercing the other operand to a string first). Arrays convert to a string primitive by joining all members together (see Why is [1,2] + [3,4] = "1,23,4" in JavaScript?). As the array only has a single member (a zero) the result is that single member as a string.

      const result = 131 + [ 0 ];
console.log(result, typeof result);                // 1310 string

const arrayCoercion = "" + [ 0 ];
console.log(arrayCoercion , typeof arrayCoercion); // 0 string

    Therefore the code concatenates 131 and 0 together.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search