JavaScript 中哪一种循环最快呢？

到底哪一种循环系统更快?

回答实际上是：for(倒序)

最要我觉得诧异的事儿是，当我还在当地电子计算机上开展检测以后，我迫不得已接纳 for(倒序)是全部 for 循环系统中更快的这一客观事实。下边我能举个对一个包括超出一百万项原素的二维数组实行一次循环系统解析xml的事例。

申明：console.time() 結果的精确度在非常大水平上在于大家运作检测的系统设置。你能在这里对精确度作进一步掌握。

 

  
const million = 1000000;  
  
const arr = Array(million); 
  
console.time('⏳'); 
  
for (let i = arr.length; i > 0; i--) {} // for(倒序)  :- 1.5ms 
  
for (let i = 0; i < arr.length; i  ) {} // for          :- 1.6ms 
  
arr.forEach(v => v)                     // foreach      :- 2.1ms 
  
for (const v of arr) {}                 // for...of     :- 11.4ms 
  
console.timeEnd('⏳'); 
 

导致那样結果的缘故非常简单，在编码中，正序和倒序的 for 循环系统基本上花销一样的時间，只是相距了 0.1 ms。缘故是，for(倒序)只必须测算一次起止自变量 let i = arr.length，而在正序的 for 循环系统中，它在每一次自变量提升后都是会查验标准 i

而 forEach 是 Array 原形的一个方式，与一般的 for 循环系统对比，forEach 和 for…of 必须花销大量的時间开展二维数组迭代更新。(译员注：但特别注意的是，for…of 和 forEach 都从目标中获得了数据信息，而原形并沒有，因而沒有对比性。)

循环系统的种类，及其大家应当在哪里应用他们

1. For 循环系统(正序和倒序)

我觉得，或许大家都应当对这一基本循环系统十分了解了。我们可以在一切大家必须的地区应用 for 循环系统，依照核准的频次运作一段编码。最基本的 for 循环系统运作最快速的，那大家每一次都应当应用它，对不对?并要不然，特性不仅仅仅唯一限度，编码易读性通常更为关键，就要大家挑选合适大家应用软件的形变就可以。

2. forEach

这一方式必须接纳一个回调函数做为键入主要参数，遍历数组的每一个原素，并实行大家的回调函数(以原素自身和它的数据库索引(可选主要参数)做为主要参数授予给回调函数)。forEach 还容许在回调函数中应用一个可选主要参数 this。

 

  
const things = ['have', 'fun', 'coding']; 
  
const callbackFun = (item, idex) => { 
  
    console.log(`${item} - ${index}`); 
  
} 
  
things.foreach(callbackFun);  
  
/* 輸出   
  
have - 0 
  
fun - 1 
  
coding - 2  
  
*/ 
 

3. for…of

for…of 是在 ES6(ECMAScript 6)中完成规范化的。它会对一个可迭代更新的目标(比如 array、map、set、string 等)建立一个循环系统，而且有一个突显的优势，即出色的易读性。

 

  
const arr = [3, 5, 7]; 
  
const str = 'hello'; 
  
for (let i of arr) { 
  
   console.log(i); // 輸出 3, 5, 7 
  
} 
  
for (let i of str) { 
  
   console.log(i); // 輸出 'h', 'e', 'l', 'l', 'o' 
  
} 
 

必须留意的是，请不要在制作器中应用 for……of，就算 for……of 循环系统提早停止。在撤出循环系统后，制作器被关掉，并试着再度迭代更新，不容易造成一切进一步的結果。

4. for in

for…in 会在目标的全部可枚举类型特性上迭代更新特定的自变量。针对每一个不一样的特性，for…in 句子除回到数据数据库索引外，还将回到客户界定的特性的名字。因而，在遍历数组时最好是应用含有数据数据库索引的传统式 for 循环系统。由于 for…in 句子还会继续迭代更新除二维数组原素以外的客户界定特性，即使大家改动了二维数组目标(比如加上自定特性或方式)，仍然这般。

 

  
const details = {firstName: 'john', lastName: 'Doe'}; 
  
let fullName = ''; 
  
for (let i in details) { 
  
    fullName  = details[i]   ' '; // fullName: john doe 
  
} 
 

for…of 和 for…in

for…of 和 for…in 中间的关键差别是他们迭代更新的內容。for…in 循环系统遍历对象的特性，而 for…of 循环系统解析xml可迭代更新目标的值。

 

  
let arr= [4, 5, 6]; 
  
for (let i in arr) { 
  
   console.log(i); // '0', '1', '2' 
  
} 
  
for (let i of arr) { 
  
   console.log(i); // '4', '5', '6' 
  
} 
 

结果

• for 更快，但易读性较为差
• foreach 较为快，可以操纵內容
• for...of 较慢，但香
• for...in 较慢，没那麼便捷