一、使用for循环遍历数组
const arr = [1, 2, 3, 4];
for (let i = 0; i < arr.length; i++) {
console.log(arr[i]);
}
使用for循环遍历数组是最基本的方法。通过设置循环的初始值和循环条件来遍历数组中的元素。每次循环，我们都会访问下一个元素。
for循环还可以倒序遍历数组。这是因为我们只需要修改循环的初始值和循环条件，使它们反向即可。
for (let i = arr.length - 1; i >= 0; i--) {
console.log(arr[i]);
}
二、使用forEach遍历数组
const arr = [1, 2, 3, 4];
arr.forEach(function(item) {
console.log(item);
});
forEach方法是一个数组的函数方法，它将数组中的每个元素传递给回调函数，并依次执行回调函数。它在每个元素上运行回调函数，但它不返回新数组。回调函数的参数包括元素的值、元素的索引和数组本身。
和for循环不同，forEach方法不能跳过或者停止循环，但它在代码可读性上却非常友好。
三、使用map遍历数组并返回新数组
const arr = [1, 2, 3, 4];
const newArray = arr.map(function(item) {
return item * 2;
});
console.log(newArray);
和forEach方法类似，map方法也是一个数组的函数方法。它将元素传递给回调函数，允许我们修改元素值，最后返回一个新的数组。
map方法最有用处的地方在于不改变原数组。如果需要对原数组进行改变，使用数组的forEach方法或者for循环会更合适。
四、使用for-in遍历数组
const arr = [1, 2, 3, 4];
for (let index in arr) {
console.log(arr[index]);
}
for-in循环通常用于枚举对象。但是它也可以枚举数组，它会枚举数组元素和属性（包括非数字属性）。如果只是想遍历数组，for-in循环并不是最好的选择。
五、使用for-of遍历数组
const arr = [1, 2, 3, 4];
for (let item of arr) {
console.log(item);
}
for-of循环是ES6引入的，它是一种用于遍历可迭代对象的循环，包括数组、字符串、Set和Map等。for-of循环提供了一种更简洁、更简单的语法来遍历数组。
六、使用while循环遍历数组
const arr = [1, 2, 3, 4];
let i = 0;
while (i < arr.length) {
console.log(arr[i]);
i++;
}
while循环和for循环一样，也可以用于遍历数组。只要设置好退出循环的条件，使用while循环遍历数组同样可行。
七、遍历字符串并转换为数组
const str = 'hello world';
const arr = str.split('');
for (let item of arr) {
console.log(item.toUpperCase());
}
当需要遍历字符串时，我们可以使用JavaScript的split()方法将它转换为数组，然后使用for-of循环来遍历每一个单独的字符。在这个示例中，我们把字符串中的所有字符转换为大写的形式。
八、使用Array.from()将类数组转换为数组并遍历
const obj = {
0: 'a',
1: 'b',
2: 'c',
length: 3
};
const arr = Array.from(obj);
for (let item of arr) {
console.log(item);
}
有些时候，我们需要遍历类数组。虽然类数组不是真正的JavaScript数组形式，但是可以使用Array.from()方法将它转换为真正的JavaScript数组。
九、使用reduce()方法遍历数组并计算元素总和
const arr = [1, 2, 3, 4];
const sum = arr.reduce(function(prev, curr) {
return prev + curr;
}, 0);
console.log(sum);
reduce()方法也是一个数组的函数方法。它接收一个回调函数，其中前一个元素的结果会传递到下一个元素中。一旦处理完所有元素，reduce()方法将返回一个结果。
在这个示例中，我们使用reduce()方法计算了数组中所有元素的总和。在回调函数中，prev代表前一个元素的结果，而curr代表当前的元素。
十、ES6的解构赋值和剩余运算符遍历数组
const arr = ['a', 'b', 'c', 'd'];
const [first, second, ...others] = arr;
console.log(first, second, others);
ES6的解构赋值和剩余运算符可以帮助我们更容易地遍历和操作数组。
在这个示例中，我们使用解构赋值从数组中提取了前两个元素，并使用了剩余运算符将剩下的元素存入了一个新数组中。
十一、使用for-await-of循环遍历异步生成器生成的数组
async function* generateArr() {
yield 'a';
yield 'b';
yield 'c';
yield 'd';
}
(async () => {
for await (let item of generateArr()) {
console.log(item);
}
})();
异步生成器是ES2018中引入的新特性之一。在这个示例中，我们创建了一个异步生成器来生成一个数组，然后使用for-await-of循环来遍历这个数组。
在遍历异步生成器生成的数组时，我们使用了(async () => {})()自执行函数，以便在程序中使用async/await语法。
