为什么此功能仅在IE11上要求分号？

Question

我正在为IE 11兼容性开发一些vuejs代码。而且，我不断看到此功能出现预期的分号错误：

chemicalFilters: function (chemical) 
{            
  var max = 0;
  var min = 100;
  for (var component of this.components)
  {
     if(component.component_name == chemical)
     {
       if (max < component.component_value)
         max = component.component_value;
       if(component.component_value != 0 && min > component.component_value)
         min = component.component_value;
     }
  }

  if(max == 0 && min == 100)
    min = max;
  else
  {
    min = Math.round(min*100);
    max = Math.round(max*100);
  }

  this.component_filters.push({component_name: chemical, range:[min,max], min:min, max:max, originalRange:[min,max]});
},

特别是这一行：

if(component.component_name == chemical)

Answer 1

The problem isn't in the line you cited, but the line above it. The for...of construct was introduced in ECMAScript 2015, which is not fully supported by IE11. See MDN:

You could use a tool like Babel to transpile this into backward-compatible code, so this:

for (var component of this.components) {
  //...
}

Would be transpiled to something like this (depending on your settings):

var _iteratorNormalCompletion = true;
var _didIteratorError = false;
var _iteratorError = undefined;

try {
  for (var _iterator = this.components[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
    //...

    var component = _step.value;
  }
} catch (err) {
  _didIteratorError = true;
  _iteratorError = err;
} finally {
  try {
    if (!_iteratorNormalCompletion && _iterator.return != null) {
      _iterator.return();
    }
  } finally {
    if (_didIteratorError) {
      throw _iteratorError;
    }
  }
}