循环组数
1、for循环
for是最常用的循环，主要用来循环数组
let arr = [1,2,3];
for (let i=0; i<arr.length; i++){
console.log(i,arr[i])
}
// 0 1
// 1 2
// 2 3
2、Array.forEach()
语法：arr.forEach(callback(currentValue [, index [, array]])[, thisArg]);
callback为数组中每个元素执行的函数，该函数接收三个参数，currentValue（数组中正在处理的当前元素），index（数组中正在处理的当前元素的索引），array（forEach() 方法正在操作的数组）
thisArg为当执行回调函数 callback 时，用作 this 的值。
let arr = [1, 2, , 3]
let arrCopy1 = []
arr.map((item, index, arr) => {
arrCopy1.push(item * 2)
})
console.log(arrCopy1)
// [2, 4, 6]
-
forEach() 为每个数组元素执行一次 callback 函数
-
那些已删除或者未初始化的项将被跳过（例如在稀疏数组上）
-
与map()和reduce()不同的是，它没有返回值，总是返回undefind。
-
forEach()除了抛出异常以外，没有办法中止或跳出 forEach() 循环。
3、Array.map()
语法：
var new_array = arr.map(function callback(currentValue[, index[, array]]) {
// Return element for new_array
}[, thisArg])
callback为生成新数组元素的函数，该函数接收三个参数，currentValue（数组中正在处理的当前元素），index（数组中正在处理的当前元素的索引），array（map() 方法正在操作的数组）
thisArg为当执行回调函数 callback 时，用作 this 的值。
let arr = [1, 2, , 3]
let arrCopy2 = []
arrCopy2 = arr.map((item, index, arr) => {
return item * 2
})
console.log(arrCopy2)
// [2, 4, empty, 6]
- map 方法会给原数组中的每个元素都按顺序调用一次 callback 函数。
-
map生成一个新数组，当你不打算使用返回的新数组却使用map是违背设计初衷的，请用forEach或for-of替代。 - map 不修改调用它的原数组本身（当然可以在 callback 执行时改变原数组）
- 如果被map调用的数组是离散的，新数组将也是离散的保持相同的索引为空
4、Array.every()
语法：arr.every(callback[, thisArg])
callback用来测试每个元素的函数，它可以接收三个参数，element表示用于测试的当前值，index表示用于测试的当前值的索引，array表示调用 every 的当前数组
thisArg表示执行 callback 时使用的 this 值
let arr = [1, 2, , 3]
let boo = arr.every((item) => {
return item > 0
})
console.log(boo)
// true
-
every方法为数组中的每个元素执行一次callback函数，直到它找到一个会使callback返回 falsy的元素。如果发现了一个这样的元素，every方法将会立即返回false。否则，callback为每一个元素返回true，every就会返回true。callback只会为那些已经被赋值的索引调用。不会为那些被删除或从未被赋值的索引调用 - every 不会改变原数组
- every 和数学中的"所有"类似，当所有的元素都符合条件才会返回true。正因如此，若传入一个空数组，无论如何都会返回 true
5、Array.some()
语法：arr.some(callback(element[, index[, array]])[, thisArg])
callback用来测试每个元素的函数，接受三个参数，element（数组中正在处理的元素），index（数组中正在处理的元素的索引值），array（some()被调用的数组）
thisArg执行 callback 时使用的 this 值
let arr = [1, 2, , 3]
let boo = arr.some((item) => {
return item > 2
})
console.log(arr)
console.log(boo)
-
some() 为数组中的每一个元素执行一次 callback 函数，直到找到一个使得 callback 返回一个“真值”（即可转换为布尔值 true 的值）。如果找到了这样一个值，some() 将会立即返回 true。否则，some() 返回 false。callback 只会在那些”有值“的索引上被调用，不会在那些被删除或从来未被赋值的索引上调用
-
some() 被调用时不会改变数组。
-
如果用一个空数组进行测试，在任何情况下它返回的都是false
7、Array.reduce()
语法：arr.reduce(callback(accumulator, currentValue[, index[, array]])[, initialValue])
callback执行数组中每个值 (如果没有提供 initialValue则第一个值除外)的函数，包含四个参数、
accumulator：上一次调用回调时返回的累积值、
currentValue：数组中正在处理的元素、
index：数组中正在处理的当前元素的索引、 如果提供了initialValue，则起始索引号为0，否则从索引1起始）
array：调用reduce()的数组
initialValue：作为第一次调用 callback函数时的第一个参数的值。 如果没有提供初始值，则将使用数组中的第一个元素。 在没有初始值的空数组上调用 reduce 将报错
var myArray = ['a', 'b', 'a', 'b', 'c', 'e', 'e', 'c', 'd', 'd', 'd', 'd'];
var myOrderedArray = myArray.reduce(function (accumulator, currentValue) {
if (accumulator.indexOf(currentValue) === -1) {
accumulator.push(currentValue);
}
return accumulator
}, [])
console.log(myOrderedArray); // [a,b,c,e,d]
- reduce为数组中的每一个元素依次执行callback函数，不包括数组中被删除或从未被赋值的元素
- 回调函数第一次执行时，accumulator 和currentValue的取值有两种情况：如果调用reduce()时提供了initialValue，accumulator取值为initialValue，currentValue取数组中的第一个值；如果没有提供 initialValue，那么accumulator取数组中的第一个值，currentValue取数组中的第二个值
Array.reduceRight() 与 Array.reduce() 差不多，只是为从右向左遍历
7、while
while 语句可以在某个条件表达式为真的前提下，循环执行指定的一段代码，直到那个表达式不为真时结束循环
示例：
let n = 0;
while (n < 3) {
n++;
}
console.log(n);
// expected output: 3
注：使用break语句在condition计算结果为真之前停止循环
8、do...while
do...while 语句创建一个执行指定语句的循环，直到condition值为 false。在执行statement 后检测condition，所以指定的statement至少执行一次
示例：
const list = ['a', 'b', 'c']
let i = 0
do {
console.log(list[i]) //value
console.log(i) //index
i = i + 1
} while (i < list.length)
9、for...in
for..in循环可以用来遍历对象的可枚举属性列表（包括[[Prototype]]链）
主要用于遍历对象，通过属性列表可以获取属性值
for (let property in object) {
console.log(property) //property name
console.log(object[property]) //property value
}
10、for...of
for..of循环首先会向被访问对象请求一个迭代器对象，然后通过调用迭代器对象的next()方法来遍历所有返回值。
数组有内置的@@iterator，因此for..of可以直接应用在数组上。
let arr = [1, 2, 3]
let it = arr[Symbol.iterator]();
it.next() // {value: 1, done: false}
it.next() // {value: 2, done: false}
it.next() // {value: 3, done: false}
it.next() // {value: undefined, done: true}
和数组不同，普通对象是没有内置的@@iterator，所以无法自动完成for..of遍历。所以针对对象不要使用for...of。
当然，你可以给任何想遍历的对象定义@@iterator，举例来说：
image.png
这个迭代器会生成‘无限个’随机数，因为我们添加了一条break语句，防止程序被挂起。
image.png
网友评论