zoukankan      html  css  js  c++  java
  • 《javascript设计模式与开发实践》阅读笔记(7)—— 迭代器模式

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

    迭代器模式可以把迭代的过程从业务逻辑中分离出来,在使用迭代器模式之后,即使不关心对象的内部构造,也可以按顺序访问其中的每个元素。

    流行语言如Java、Ruby 等都已经有了内置的迭代器实现,许多浏览器也支持JavaScript的Array.prototype.forEach。

    jQuery中的迭代器

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

    实现自己的迭代器

    1 var each = function( ary, callback ){
    2   for ( var i = 0, l = ary.length; i < l; i++ ){
    3     callback.call( ary[i], i, ary[ i ] ); // 把下标和元素当作参数传给callback 函数
    4   }
    5 };
    6 
    7 each( [ 1, 2, 3 ], function( i, n ){
    8   alert ( [ i, n ] );
    9 });

    内部迭代器和外部迭代器

    ·内部迭代器
    我们刚刚编写的each函数属于内部迭代器,each函数的内部已经定义好了迭代规则,它完全接手整个迭代过程,外部只需要一次初始调用。
    内部迭代器在调用的时候非常方便,外界不用关心迭代器内部的实现,但由于内部迭代器的迭代规则已经被提前规定,上面的each函数就无法同时迭代2个数组了。

    在不改变each函数情况下,如果要比较两个数组是否完全一致就得这样写

     1 var compare = function( ary1, ary2 ){
     2     if ( ary1.length !== ary2.length ){
     3         throw new Error ( 'ary1 和ary2 不相等' );
     4     }
     5     each( ary1, function( i, n ){
     6         if ( n !== ary2[ i ] ){
     7             throw new Error ( 'ary1 和ary2 不相等' );
     8         }
     9     });
    10     alert ( 'ary1 和ary2 相等' );
    11 };
    12 
    13 compare( [ 1, 2, 3 ], [ 1, 2, 4 ] ); // throw new Error ( 'ary1 和ary2 不相等' );    

    ·外部迭代器

    外部迭代器必须显式地请求迭代下一个元素,外部迭代器增加了一些调用的复杂度,但我们也可以手工控制迭代的过程或者顺序。

     1 var Iterator = function( obj ){
     2   var current = 0; //指代当前序号
     3   var next = function(){ //next方法,序号+1
     4     current += 1;
     5   };
     6   var isDone = function(){ //isDone方法,判断是否数组遍历结束
     7     return current >= obj.length;
     8   };
     9   var getCurrItem = function(){ //getCurrItem方法,获得当前序号的具体值
    10     return obj[ current ];
    11   };
    12   return { //返回一个对象,利用闭包保存current的值
    13     next: next,
    14     isDone: isDone,
    15     getCurrItem: getCurrItem
    16   }
    17 };
    18 
    19 var iterator_1 = Iterator( [ 1, 2, 3 ] ); //生成实例
    20 var iterator_2 = Iterator( [ 1, 2, 3 ] );
    21 
    22 var compare = function( iterator1, iterator2 ){
    23   while( !iterator1.isDone() && !iterator2.isDone() ){ //当两者都没有遍历结束时
    24     if ( iterator1.getCurrItem() !== iterator2.getCurrItem() ){ //如果两者当前序号的值不等
    25       throw new Error ( 'iterator1 和iterator2 不相等' );
    26     }
    27     iterator1.next(); //序号增加
    28     iterator2.next();
    29   }
    30   alert ( iterator1+'和'+iterator2+'相等' );
    31 }
    32 
    33 compare( iterator_1, iterator_2 ); // 输出:iterator_1 和iterator_2 相等

    迭代类数组对象和字面量对象

    无论是内部迭代器还是外部迭代器,只要被迭代的聚合对象拥有length 属性而且可以用下标访问,那它就可以被迭代。
    JavaScript中,for in语句可以用来迭代普通字面量对象的属性。jQuery中的$.each函数如下

     1 $.each = function( obj, callback ) {
     2   var value,
     3     i = 0,
     4     length = obj.length,
     5     isArray = isArraylike( obj );
     6   if ( isArray ) { // 迭代类数组
     7     for ( ; i < length; i++ ) {
     8       value = callback.call( obj[ i ], i, obj[ i ] );
     9       if ( value === false ) {
    10         break;
    11       }
    12     }
    13   } else {
    14     for ( i in obj ) { // 迭代object 对象
    15       value = callback.call( obj[ i ], i, obj[ i ] );
    16       if ( value === false ) {
    17         break;
    18       }
    19     }
    20   }
    21   return obj;
    22 };

    倒序迭代器

    遍历时候反着来就可以了

    中止迭代器

    给个条件,让迭代器终止。
    jQuery的each 函数里有这样一句:

    1 if ( value === false ) {
    2     break;
    3 }

    这句代码的意思是,约定如果回调函数的执行结果返回false,则提前终止循环。

    总结

    迭代器模式是一种相对简单的模式,简单到很多时候我们都不认为它是一种设计模式。目前的绝大部分语言都内置了迭代器。

  • 相关阅读:
    P1030 求先序排列 P1305 新二叉树
    spfa
    Clairewd’s message ekmp
    Cyclic Nacklace hdu3746 kmp 最小循环节
    P1233 木棍加工 dp LIS
    P1052 过河 线性dp 路径压缩
    Best Reward 拓展kmp
    Period kmp
    Substrings kmp
    Count the string kmp
  • 原文地址:https://www.cnblogs.com/grey-zhou/p/6126582.html
Copyright © 2011-2022 走看看