I'm getting this error SCRIPT1004: Expected ';' inside two "For" loops starting at the "of" portion in Internet Explorer. Is there a workaround to resolving this issue?

for(item of workstationData.coPathColumns) {
    var builtId = '#icat-' + item;
    if(!!$(builtId)[0].innerText) {
        $(builtId)[0].parentNode.hidden = false;
    }
}

I'm getting this error SCRIPT1004: Expected ';' inside two "For" loops starting at the "of" portion in Internet Explorer. Is there a workaround to resolving this issue?

for(item of workstationData.coPathColumns) {
    var builtId = '#icat-' + item;
    if(!!$(builtId)[0].innerText) {
        $(builtId)[0].parentNode.hidden = false;
    }
}

• javascript
• internet-explorer

• 6 ie does not support for..of – brk Commented Mar 6, 2019 at 14:29
• I see that, is there a workaround this for IE? – Yodavish Commented Mar 6, 2019 at 14:37
• Do not use it seems like a good work around. :) Either you need to transpile your code or not use it. – epascarello Commented Mar 6, 2019 at 14:41

2 Answers 2

As mented by brk, IE doesn't support for of, look here for details.

You can use forEach or a simple for loop. I prefer simple for loop for the reason that it is not callback based loop(Asynchronous), whereas, forEach takes a callback function.

for(let i =0; i< workstationData.coPathColumns.length; i++) {
    item = workstationData.coPathColumns[i]; //assuming item is defined before, otherwise use let item = ...
    var builtId = '#icat-' + item;
    if(!!$(builtId)[0].innerText) {
        $(builtId)[0].parentNode.hidden = false;
    }
}

Internet Explorer does not support a for ... of loop.

As seen here: MDN Documentation

Furthermore I remend you to check if a function or feature set is support for a browser you have to support, in this case Internet Explorer, check caniuse.

Your code:

for(item of workstationData.coPathColumns) {
    var builtId = '#icat-' + item;
    if(!!$(builtId)[0].innerText) {
        $(builtId)[0].parentNode.hidden = false;
    }
}

can be transformed into a traditional for loop:

for(var i = 0; i < workstationData.coPathColumns; i++) {
    var builtId = '#icat-' + workstationData.coPathColumns[i];
    if(!!$(builtId)[0].innerText) {
        $(builtId)[0].parentNode.hidden = false;
    }
}

Alternatively, it's nice to have, if you automate this process of "transpiling". Therefore have a close look at babel. Pasting your code into babeljs

Produces the following output - which should be equivalent to your for...of loop transpiled into es2015-loose standard:

"use strict";

for (var _iterator = workstationData.coPathColumns, _isArray = Array.isArray(_iterator), _i = 0, _iterator = _isArray ? _iterator : _iterator[Symbol.iterator]();;) {
  if (_isArray) {
    if (_i >= _iterator.length) break;
    item = _iterator[_i++];
  } else {
    _i = _iterator.next();
    if (_i.done) break;
    item = _i.value;
  }

  var builtId = '#icat-' + item;

  if (!!$(builtId)[0].innerText) {
    $(builtId)[0].parentNode.hidden = false;
  }
}