前端有哪些循环的方法

        这篇文章主要是用来记录前端中循环数组和循环对象的方法，方便以后进行翻阅。

 for循环

        使用最基本的for循环来遍历数组或对象。可以使用数组的长度来控制循环次数，也可以使用对象的属性来遍历对象。

// 遍历数组
var arr = [1, 2, 3];
for (var i = 0; i < arr.length; i++) {
  console.log(arr[i]);
}

// 遍历对象
var obj = {a: 1, b: 2, c: 3};
for (var key in obj) {
  console.log(key, obj[key]);
}

forEach方法

        数组的forEach方法可以遍历数组的每个元素，并对每个元素执行指定的回调函数。

var arr = [1, 2, 3];
arr.forEach(function(item) {
  console.log(item);
});

map方法

        数组的map方法可以遍历数组的每个元素，并对每个元素执行指定的回调函数，最终返回一个新的数组。

var arr = [1, 2, 3];
var newArr = arr.map(function(item) {
  return item * 2;
});
console.log(newArr); // [2, 4, 6]

filter方法

        数组的filter方法可以遍历数组的每个元素，并根据指定的条件过滤出符合条件的元素，最终返回一个新的数组。

var arr = [1, 2, 3, 4, 5];
var newArr = arr.filter(function(item) {
  return item > 3;
});
console.log(newArr); // [4, 5]

find 方法

        find()方法不会改变数组元素的原始值，用于返回数组中符合条件的第一个元素，如果没有符合条件的元素，则返回undefined。array.find(function(currentValue, index, arr),thisValue)

• callback：必须。为数组中每个元素执行的函数，该函数接受三个参数：
• currentValue：必须。数组中正在处理的当前元素。
• index：可选。当前元素的索引值。
• arr：可选。当前元素所在的数组对象。
• thisValue：可选。传递给函数的值一般用 "this" 值。
• 如果这个参数为空， "undefined" 会传递给 "this" 值

let arr1 = [1, 2, 3, 4, 5];
let num = arr1.find(item => item > 1);
console.log(num)  //2

Object.keys方法

        Object.keys方法可以获取对象的所有属性名，返回一个包含属性名的数组。

var obj = {a: 1, b: 2, c: 3};
var keys = Object.keys(obj);
console.log(keys); // ['a', 'b', 'c']

for .... of 循环

   for...of 循环是一种新的迭代语法，可以用来遍历具有迭代器（iterator）接口的数据结构，包括数组、类数组对象（例如 arguments、NodeList 等）、字符串、Map、Set 等。

let iterable = [10, 20, 30];

for (let value of iterable) {
  console.log(value); // 依次输出 10、20、30
}

for .... in 循环

   for...in 循环是一种旧的迭代语法，用来遍历对象的属性。但是，它的遍历顺序是不确定的，因为它遍历的是对象的属性名，而属性名的顺序是不固定的。

let obj = { a: 1, b: 2, c: 3 };

for (let prop in obj) {
  console.log(prop); // 依次输出 'a'、'b'、'c'
}

every 方法

  every 方法可以用来检测数组的所有元素是否都满足指定条件。如果所有元素都满足条件，则返回 true；否则返回 false。

        需要注意的是：every 方法只会在数组的每个元素都满足条件时才会返回 true。如果在检测到某个元素不满足条件时就返回 false，则可以使用 some 方法。

let arr = [1, 2, 3, 4, 5];
let result1 = arr.every((item) => item > 0); // 返回 true
let result2 = arr.every((item) => item > 3); // 返回 false

some 方法

   some 方法可以用来检测数组的某些元素是否满足指定条件。如果有任意一个元素满足条件，则返回 true；否则返回 false。

let arr = [1, 2, 3, 4, 5];
let result1 = arr.some((item) => item > 3); // 返回 true
let result2 = arr.some((item) => item > 5); // 返回 false

推荐

        最后推荐下面这位大大的博客，非常详细，受益匪浅：

https://blog.youkuaiyun.com/s_y_w123/article/details/109615968#reduce__276