js设计模式——迭代模式

迭代器模式是指提供一种方法顺序访问一个聚合对象的各个元素,而又不需要暴露该对象的内部表示。

实现jq中的each迭代器

$.each( [1, 2, 3], function( i, n ){ 
console.log( '当前下标为: '+ i ); 
console.log( '当前值为:' + n ); 
});

 

 

//内部迭代
var each=function (arr,callback) {
// body...
for(var i=0,l=arr.length;i<l;i++){//也可以是倒序
let value=callback.call(arr[i],i,arr[i]);
if(value===false) //中止迭代
break;
}
}

each([1,2,3,4],function(i,v){
console.log("i:",i);
console.log("v:",v);
})

 

这里是将传入的数组通过for循环来实现的迭代。

需要注意的点是,既然可以顺序访问元素,那么也可以通过倒序来访问元素。

还需要注意,可以加上一个中止程序,来中止迭代

这里还涉及到了内部迭代。**内部迭代时内部已经定义好了迭代规则,完全接手整个迭代过程,外部只需要一次调用,调用时外界不需要关系迭代器内部实现**。这是内部迭代器的优点也是它的缺点。由于内部迭代器的迭代规则已经被提前定义好了,如果我们想要同时迭代两个数组,可能就要深入到each的回调函数中了。

var compare = function( ary1, ary2 ){ 
if ( ary1.length !== ary2.length ){ 
throw new Error ( 'ary1 和 ary2 不相等' ); 
} 
each( ary1, function( i, n ){ 
if ( n !== ary2[ i ] ){ 
throw new Error ( 'ary1 和 ary2 不相等' ); 
} 
}); 
alert ( 'ary1 和 ary2 相等' ); 
}; 
compare( [ 1, 2, 3 ], [ 1, 2, 4 ] ); // throw new Error ( 'ary1 和 ary2 不相等' );

 

外部迭代器不许显示的请求迭代下一个元素。

var Iterator=function(obj){
var current=0;

var next=function(){
current+=1;
}

var isDone=function(){
return current>=obj.length;
}

var getCurrentItem=function(){
return obj[current];
}

return {
next:next,
getCurrentItem:getCurrentItem,
isDone:isDone
}
}

var compare=function(iterator1,iterator2){
while(!iterator1.isDone()&&!iterator2.isDone()){
if(iterator1.getCurrentItem()!==iterator2.getCurrentItem()){
throw new Error('iterator1和iterator2不相等');
}

iterator2.next();
iterator1.next();
}

alert('相等');
}

var iterator1=Iterator([1,2,3,4])
var iterator2=Iterator([1,2,3,6])

compare(iterator1,iterator2)

 

外部迭代器的使用比内部迭代器灵活,能满足的需求也更多。使用内部迭代器还是外部迭代器,还是要视情况而定。

迭代数组和字面量对象

前面的迭代器都需要length方法,如果我们遍历字面量对象,可能前面的写法是不适用的。在js中,for in 可以迭代普通的字面量对象属性,

可以在each函数中添加上一个判断,如果是数组,就使用for循环,如果是对象,就使用for in。

posted @ 2020-09-21 13:20  ellenxx  阅读(141)  评论(0编辑  收藏  举报