javascript的六种迭代器

2 篇文章 0 订阅

下面迭代器以Array对象的使用写代码举例

forEach迭代器
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach

array.forEach(callback[, thisArg]);

参数

callback
在数组每一项上执行的函数,接收三个参数:
currentValue
当前项(指遍历时正在被处理那个数组项)的值。
index
当前项的索引(或下标)。
array
数组本身。
thisArg
可选参数。用来当作callback 函数内this的值的对象。
代码范例

var array = [1, 2, 3, 4, 5];
array.forEach((value, index) => {
    console.log("index#" + index + " = " + value);
});

every迭代器

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/every

测试数组的所有元素是否都通过了指定函数的测试。
arr.every(callback[, thisArg]);

参数

callback
用来测试每个元素的函数。
thisArg
执行 callback 时使用的 this 值。

callback的参数,与forEach相同,分别是value,index,数组对象本身。数组中的元素,每个都执行一次callback,如果存在元素,是callback返回false,则every方法就会返回false;如果不存在这样的元素,则every方法返回truefunction isBigEnough(element, index) {
    return (element >= 10);
}

var passed = [12, 54, 18, 130, 44];
console.log(passed.every(isBigEnough));  //结果为true。因为每个元素都比10大

some迭代器
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/some
与every类似,some方法是遍历所有的数组元素,如果找到了是callback返回true的元素,立即返回true;如果找不到,则返回false。

reduce迭代器
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce
reduce 为数组中的每一个元素依次执行回调函数,不包括数组中被删除或从未被赋值的元素,接受四个参数:初始值(或者上一次回调函数的返回值),当前元素值,当前索引,调用 reduce 的数组

[0, 1, 2, 3, 4].reduce((previousValue, curValue, index) => {
    console.log("previousValue=" + previousValue + ", curValue=" + curValue);
});

执行结果
previousValue=0, curValue=1
previousValue=undefined, curValue=2
previousValue=undefined, curValue=3
previousValue=undefined, curValue=4
如果采用这种方式,因为每次都没有返回值,所以只有第一次为初始值,后面的遍历previous都为undefined。

map迭代器
map() 方法返回一个由原数组中的每个元素调用一个指定方法后的返回值组成的新数组。
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/map
map 方法会给原数组中的每个元素都按顺序调用一次 callback 函数。callback 每次执行后的返回值组合起来形成一个新数组。 callback 函数只会在有值的索引上被调用;那些从来没被赋过值或者使用 delete 删除的索引则不会被调用。
代码举例:

var arr = [1, 2, 3, 4].map((value, index) => {
    return value * index;
});
console.log(arr);

返回结果:
[ 0, 2, 6, 12 ]

filter迭代器
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/filter
filter() 方法使用指定的函数测试所有元素,并创建一个包含所有通过测试的元素的新数组
具体描述:
filter 为数组中的每个元素调用一次 callback 函数,并利用所有使得 callback 返回 true 或 等价于 true 的值 的元素创建一个新数组。callback 只会在已经赋值的索引上被调用,对于那些已经被删除或者从未被赋值的索引不会被调用。那些没有通过 callback 测试的元素会被跳过,不会被包含在新数组中。
比如说:

function isBigEnough(element) {
  return element >= 10;
}
var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
// filtered is [12, 130, 44]

使用测试函数,测试函数会过滤大于等于10的值,而数组12, 130和44大于10,所以会过滤出这几个值,放到新数组。

通常而言,callback 只会在已经赋值的索引上被调用,对于那些已经被删除或者从未被赋值的索引不会被调用。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值