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。