Array.map() "syntax Error" in IE11, mapping multiple JSON Object fields

Question

I have the following angularjs function which works in Chrome, FF, Safari, but not in IE11:

var dataListDecision = [];

$scope.readDataList = function ()
{
    dataListDecision = results.data.map(el => ({
        idApplication: el['Application Reference'],
        field: 'Decision',
        newValue: el['Decision Outcome']
    }))
 };

In IE11I get the console error of "SCRIPT1002: Syntax error" and it highlights the "=>".

I searched for a solution and found this question/answer: Error with Array.map() in IE11

But this doesn't address the mapping I'm doing of selecting multiple fields from an existing JSON Object array to create another JSOn Object array.

I've tried to implement this solution in the following way:

dataListDecision = results.data.map(function (el) {
   return
    ({
        idApplication: el['Application Reference'],
        field: 'Decision',
        newValue: el['Declaration Outcome'],
        idUser: '0'
    })
})

This stops any errors, but results in the array being filled with the correct number of objects, but each object contains no data and is just "undefined".

IE does not support arrow functions. Integrate Babel into your build process rather than dumbing down your code for an obsolete browser. You need to return the created object in a full function. — CertainPerformance
– CertainPerformance, Commented Jun 7, 2018 at 10:28
how would I update the function so it returns data? I tried adding return inside the {} after "(el)" but this have the exact same results (I've updated my question to show the "return") — Vereonix
– Vereonix, Commented Jun 7, 2018 at 10:35

Aleksey Solovey · Accepted Answer · 2018-06-07 10:40:24Z

3

IE is not a big fan of ES6 syntax, so you correctly fixed it by removing the arrow notation. However

JavaScript automatically inserts ; where it thinks it's needed.

In your code

dataListDecision = results.data.map(function (el) {
   return
    ({
      ...

It inserts the ; after return, turning it into return;, which is why your result is undefined

To fix that simply write it as:

dataListDecision = results.data.map(function (el) {
   return ({
     ...

answered Jun 7, 2018 at 10:40

Aleksey Solovey

4,1663 gold badges18 silver badges34 bronze badges

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

2 Comments

baao Over a year ago

you correctly fixed it by removing the arrow No, the correct fix would be to use babel. There's no reason to write code for an obsolete browser, just as @certainperformance mentioned. Upvoted for the rest of the answer though

Vereonix Over a year ago

You wonderful person! Ofc it was such a silly little thing I missed, this works perfectly thank you.

Collectives™ on Stack Overflow

Array.map() "syntax Error" in IE11, mapping multiple JSON Object fields

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related