以下是详细的攻略：

JavaScript中for循环的几种写法与效率总结

1. for循环基本语法

for (let i = 0; i < length; i++) {
  // 循环体
}

其中，let i = 0 表示初始化一个变量 i ，初始值为 0 ； i < length 表示循环条件，当 i 小于 length 时，执行循环体； i++ 表示每次循环后， i 的值增加1。

2. for...in 循环

for...in 循环用于遍历对象的属性名，语法如下：

for (let key in obj) {
  // 循环体
}

其中， key 表示对象的属性名， obj 表示要遍历的对象。

示例：

const obj = {a: 1, b: 2, c: 3};
for (let key in obj) {
  console.log(key, obj[key]);
}

运行结果为：

"a" 1
"b" 2
"c" 3

3. for...of 循环

for...of 循环用于遍历可迭代对象（例如数组、字符串、Map、Set 等），语法如下：

for (let item of iterable) {
  // 循环体
}

其中， item 表示可迭代对象的每个项， iterable 表示要遍历的可迭代对象。

示例：

const arr = [1, 2, 3];
for (let item of arr) {
  console.log(item);
}

运行结果为：

1
2
3

4. forEach 循环

forEach 循环用于遍历数组，语法如下：

array.forEach(function(item, index, array) {
  // 循环体
});

其中， item 表示数组的每个项， index 表示当前项在数组中的索引， array 表示要遍历的数组。

示例：

const arr = [1, 2, 3];
arr.forEach((item, index) => {
  console.log(index, item);
});

运行结果为：

0 1
1 2
2 3

5. for...in 与 for...of 的效率比较

在遍历数组或类数组对象（例如 arguments 对象）时， for...in 循环既可以遍历数组的下标，也可以遍历数组的原型属性，所以不建议使用 for...in 循环遍历数组。而 for...of 循环只能遍历数组元素，不会遍历原型属性，效率比 for...in 循环高。

示例：

const arr = [1, 2, 3];
arr.foo = 'bar';

for (let key in arr) {
  console.log(key); // 输出 0, 1, 2, "foo"
}

for (let item of arr) {
  console.log(item); // 输出 1, 2, 3
}

总结

• for 循环适用于任何类型的循环，特别是在需要前进或后退的循环（如二分查找，或从尾部开始循环）时。
• for...in 循环用于遍历对象的属性名，不适用于遍历数组。
• for...of 循环用于遍历可迭代对象，特别适用于遍历数组。

使用时应根据需要灵活选择。以上就是关于 JavaScript 中 for 循环的几种写法与效率总结的详细攻略。