JavaScript for 循环比较

Question

for 循环的效率问题比较，建议看一下这篇文章：深入了解 JavaScript 中的 for 循环

判断是否为空对象

// 兼容写法，JavaScript in 操作符可获取对象的属性；delete 操作符则删除属性
function isEmptyObj(obj) {
  for (var i in obj) {
    if (obj.hasOwnProperty(i)) {
      return false
    }
  }
  return true
}

// ES6 写法
function isEmptyObj(obj) {
  return Object.keys(obj).length == 0
}

遍历效率：for > for-of > forEach > filter > map > for-in。虽然 for-in 遍历 Array 元素性能没有普通的 for 循环好，但对于 稀疏数组 的使用是极好的，尤其在数组长度很大的情况，如下：

const arr = []
arr[99] = '哈哈'
arr[999] = '呵呵'
arr[9999] = '滚'

// 优化版 for 循环，只计算一次数组长度（共遍历了 10000 次）
for (let i = 0, len = arr.length; i < len; i++) {
  if (i in { '99': '', '999': '', '9999': '' }) {
    console.log(true + ' ' + i)
  } else {
    console.log(false)
  }
}

// for-in（共遍历了 3 次）
for (const key in arr) {
  if (key in { '99': '', '999': '', '9999': '' }) {
    console.log(arr[key])
  }
}

// 两者遍历次数相差很大，这种情况下采用 for-in 是效率高很多。

循环方式的比较

遍历方式	描述	缺点
for	效率最高	改进版 for 循环：使用一个变量存储数组的长度，可以省去每次循环都去计算数组长度
for-of	ES6 新增的方法，最简洁、最直接的遍历数组元素的方法，为了改进 forEach、for-in 缺陷而生的新方法。支持数组、对象、字符串、Map 对象、Set 对象遍历	不支持遍历普通对象，可以使用 for-in 代替
forEach	每执行一遍，都会执行 callback(item, index, array)。其中，item 是当前项，index 是当前索引项，array 是数组对象本身	不能 break 、continue 或者 return
filter	用来筛选符合某种条件的元素，将符合条件的元素重新组成一个新的数组
map	面向数组，不改变原数组。对于 未被初始化、被删除项（delete 操作符）、数组的属性（array.name='小明'） 都不会执行 callback 函数
for-in	for-in 是为普通对象设计的，for (var index in arr) { } 赋值给 index 的值不是索引值 1、2，而是字符串 '1'，'2'。	for-in 缺点更加明显，它不仅遍历数组中的元素，还会遍历自定义的属性，甚至原型链上的属性都被访问到。而且，遍历数组元素的顺序可能是随机的。