本文解析JavaScript中的迭代器模式，区分内部与外部两种实现。内部迭代器封装了遍历逻辑，类似jQuery的$.each，使用便捷但缺乏灵活性；外部迭代器通过next等方法手动控制进度，虽调用复杂但能支持多目标迭代，如比较两个数组。通过代码示例展示两者的实现差异及适用场景。
迭代器模式概述
迭代器模式主要包含内部迭代器和外部迭代器两种形式。内部迭代器在函数内部预设好迭代规则，完全接管整个迭代过程，外部调用者只需发起一次初始调用即可。
内部迭代器
内部迭代器
以下展示一个自行实现的类似jQuery中$.each()方法的each()函数，这属于内部迭代器的典型应用。
//实现一个jq的$.each()迭代器
var arr = [1, 2, 3, 4, 5, 6, 7, 8]
var each = function(arr, callback){
for(var i=0; i<arr.length; i++){
callback.call(null, i, arr[i]) //把下标和元素当作参数传递给callback参数
}
}
each(arr, function(i, n){
console.log(i, n);
})
//类似于jquery的 $.each(arr, function(i,n){})内部迭代器在调用时十分简便，但其局限性在于无法同时处理多个目标值。例如，前文提到的each函数便无法直接用于同时迭代两个数组。
若需对两个数组进行相等性判断，且不修改迭代器内部实现，只能通过each的回调函数来完成。尽管此方法可行，但代码结构显得不够优雅。
//对两个数组做相等性判断时，如果不改迭代器内部方法实现，只能通过each的回调函数进行实现，虽然能实现，但不是很优雅。
let compare = function (ary1, ary2) {
if(ary1.length !== ary2.length){
throw new Error('ar1和ary2长度不相等。')
}
each(ary1, function (i, n) {
if(n !== ary2[i] ){
throw new Error('ary1和ary2不相等。')
}
})
console.log('ary1和ary2相等!');
}
compare([1,2,3], [1,2, 3])外部迭代器
外部迭代器
外部迭代器要求显式请求获取下一个元素。虽然这增加了调用的复杂度，却提升了操作的灵活性，允许程序手动控制迭代的进程与顺序。
外部迭代器示例代码1：
let Iterator = function (obj) {
let current = 0;
let next = function () {
current += 1
}
let isNotDone = function () {
return current <= obj.length
}
let getCurrentItem = function () {
return obj[current];
}
return {
next,
isNotDone,
getCurrentItem
}
}
//外部迭代器通过next方法进行手工迭代
let arr = ['a', true, false, '10', 88, 741]
let iterator1 = Iterator(arr)
console.log(iterator1.getCurrentItem()); // a
iterator1.next()
console.log(iterator1.getCurrentItem()); // true
iterator1.next()
console.log(iterator1.getCurrentItem()); // false
iterator1.next()
console.log(iterator1.getCurrentItem()); // '10'
//改写compare函数
let compare = function (iterator1, iterator2) {
while(iterator1.isNotDone() && iterator2.isNotDone()){
if(iterator1.getCurrentItem() !== iterator2.getCurrentItem()){
throw new Error('iterator1和iterator2不相等。')
}
iterator1.next()
iterator2.next()
}
console.log('iterator1和iterator2相等。');
}
let iterator1 = Iterator([1, 2, 3, 4])
let iterator2 = Iterator([1, 2, 3, 4, 5])
compare(iterator1, iterator2) //iterator1和iterator2不相等。外部迭代器示例代码2：
let Iterator = function (array) {
let nextIndex = 0;
return {
next: function () {
return nextIndex < array.length ?
{value: array[nextIndex++], done: false}:
{done: true};
}
}
}
let it = Iterator(['a', 3, 10])
console.log(it.next().value); //a
console.log(it.next().value); //3
console.log(it.next().value); //10 迭代到这步已经把所有值都迭代完成
console.log(it.next().done); //true以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持本站。