AngularJS项目IE11兼容：Symbol.iterator替代方案咨询

嘿，我太懂你这种被IE11坑的感觉了——它完全不支持ES6的Symbol特性，所以依赖Symbol.iterator的for...of循环或者相关迭代器逻辑肯定会报错，你第二次遇到的“无法读取未定义的属性‘done’”，大概率是尝试手动模拟迭代器但没处理到位导致的。直接换用IE11原生支持的循环写法就好，下面分场景给你具体方案：

1. 遍历数组（AngularJS里最常用的场景） #

如果原来用了for...of遍历数组，直接换成下面任意一种兼容写法：

方案1：传统for循环（兼容性拉满，所有IE版本都支持） #

// 假设myArray是你要遍历的数组
for (var i = 0; i < myArray.length; i++) {
  var item = myArray[i];
  // 这里写你的处理逻辑，比如操作item或者用AngularJS的$scope
}

方案2：AngularJS内置的angular.forEach（框架内推荐用这个） #

AngularJS本身提供了兼容IE的遍历方法，不管是数组还是对象都能处理：

angular.forEach(myArray, function(item, index) {
  // item是当前元素，index是索引
  // 比如可以直接修改$scope里的变量
});

方案3：数组原生forEach（IE11支持，注意this上下文） #

如果习惯用数组方法，IE11支持Array.prototype.forEach，只是要注意如果需要绑定this，要传第三个参数：

myArray.forEach(function(item, index) {
  // 处理逻辑
}, this); // 可选，把当前上下文绑定到回调里

2. 遍历对象的属性 #

如果原来的代码是遍历对象的键值对，比如用Object.keys配合for...of，换成下面的写法：

方案1：for...in循环（记得加hasOwnProperty判断） #

for...in会遍历对象原型链上的属性，所以一定要加判断避免意外：

// 假设myObj是要遍历的对象
for (var key in myObj) {
  if (myObj.hasOwnProperty(key)) {
    var value = myObj[key];
    // 处理key和value
  }
}

方案2：还是用angular.forEach #

同样支持对象遍历，参数顺序是value在前，key在后：

angular.forEach(myObj, function(value, key) {
  // 处理value和key
});

3. 遍历类数组对象（比如NodeList、arguments） #

IE11里像document.querySelectorAll返回的NodeList不能直接用forEach，需要转成数组或者用传统循环：

方案1：转成数组后用forEach #

var elems = Array.prototype.slice.call(document.querySelectorAll('.my-class'));
elems.forEach(function(elem) {
  // 处理DOM元素
});

方案2：传统for循环 #

var elems = document.querySelectorAll('.my-class');
for (var i = 0; i < elems.length; i++) {
  var elem = elems[i];
  // 处理DOM元素
}

额外提醒 #

• 尽量避免用let/const，IE11对它们的支持有坑，换成var更稳妥；
• 不要用箭头函数，IE11完全不支持，全部换成普通function；
• 别碰依赖Symbol的API，比如Map/Set的迭代器、Array.prototype.values()这些，IE11都不认识。

内容的提问来源于stack exchange，提问作者panagulis72