歹佬们，问个 js 小问题？

[gaocc]

在 vue2 框架里看到这样一段代码，有个细节没看懂

function getTypeIndex (type, expectedTypes): number {
  if (!Array.isArray(expectedTypes)) {
    return isSameType(expectedTypes, type) ? 0 : -1
  }
  for (let i = 0, len = expectedTypes.length; i < len; i++) {
    if (isSameType(expectedTypes[i], type)) {
      return i
    }
  }
  return -1
}

for (let i = 0, len = expectedTypes.length; i < len; i++)

这行代码框架里是这样的

for (let i = 0; i < expectedTypes.length; i++)

一般习惯是这样的

框架这种写法有什么好处吗？

[clcx]

上满减少了计算次数，中间的比较语句只需要和一个固定值比较；
下面每次都要先计算数组长度，再进行比较

[gaocc]

@clcx 哦哦对哦，一下没反应过来。thanks

[kop1989smurf]

同意楼上。
拆开就能看出区别了，一个是：if(i<30)，一个是 if(i<xx.length)
循环 n 次，下面就多获取了 n-1 次数组的长度。

[murmur]

我刚才搜了一下，对于新浏览器没区别的，你知道缓存，浏览器也不是傻子，大多数场景下你感觉不出这个优化，还是要靠不要频繁操作 dom 来获取性能

[sgiyy]

一般是作为性能优化的手段，用变量缓存后面重复调用的数据。涉及不同的场景，实际效果可能还不一样。
也可以看下这个讨论： https://www.zhihu.com/question/29714976

[murmur]

https://stackoverflow.com/questions/9592241/javascript-is-the-length-method-efficient

Iterating over a thousand items, using array.length will only cost you an extra 2 ms. In other words: beware premature optimization.

1000 词循环只多不到 2ms ，换句话说，不要过度优化

[gaocc]

@murmur

[gaocc]

看了下，性能问题没大区别。就凸显一个代码习惯和角度问题吧
我以后应该都是这样方式了 for (let i = 0, len = expectedTypes.length; i < len; i++)

[jawilx]

就一个习惯问题吧，现在浏览器已经优化的很好了，没必要搞很复杂