JS Function Issues with array.filter()

So I have a JavaScript function I'm working on. I noticed that my editor is flagging an error on line 4 but the function works in every browser I've tested except for IE and Safari. I find this particularly weird.

Basic idea for the function is: take 'element' (the ID of a html element) and convert it to a string, define an array of all possible versions of 'element', remove 'element' from the array, and perform another function using the now-filtered array and 'element' as variables. This is what I have:

function thisFunction(element){
    var eStr=element.toString();
    var eArray=['element1', 'element2', 'element3'];
    var fArray=eArray.filter(e=>e!==eStr);
    fArray.forEach(doThis);
    function doThis(value){

        Now do this with 'fArray'....

        return false;
        doThis();
        }

    And do this with 'element'...

    return false;
    thisFunction();
    }

The error is apparently something to do with the "var fArray" line, but I cant see a problem. The error when I click the link that is supposed to activate this function is "thisFunction is undefined" as well as the error on line 4.

1 answer

  • answered 2017-11-15 19:33 Matt Holland

    The problem on line 4 is that IE does not support the arrow function syntax you're using in the callback. Changing this line:

    var fArray=eArray.filter(e=>e!==eStr);
    

    To something like:

    var fArray=eArray.filter(function(e) { return e!==eStr; });
    

    Should fix things.

    Details on which JS features are supported by which browsers can be found at https://kangax.github.io/compat-table/es6/