zoukankan      html  css  js  c++  java
  • jQuery迭代器

    http://www.imooc.com/code/3417

    迭代器

    迭代器是一个框架的重要设计。我们经常需要提供一种方法顺序用来处理聚合对象中各个元素,而又不暴露该对象的内部,这也是设计模式中的迭代器模式(Iterator)。

    jQuery中的$.each方法就是一个典型的迭代器,通过each我们可以传入额外的function,然后来对所有的item项进行迭代操作,如下代码:

    $.each([52, 97], function(index, value) {
      alert(index + ': ' + value);
    });
    $( "li" ).each(function( index ) {
      console.log( index + ": "" + $(this).text() );
    });

    针对迭代器,这里有几个特点:

    ☑ 访问一个聚合对象的内容而无需暴露它的内部。

    ☑ 为遍历不同的集合结构提供一个统一的接口,从而支持同样的算法在不同的集合结构上进行操作。

    ☑ 遍历的同时更改迭代器所在的集合结构可能会导致问题。

    简单的说:封装实现,然后迭代器的聚合对象不用关心迭代的过程,从而符合SRP原则。

    jQuery源码:静态方法

    // args is for internal usage only,
    //并没有操作过obj。所以obj是不变的
     each: function( obj, callback, args ) {
    var value, i = 0, length = obj.length, isArray = isArraylike( obj );//类数组的判断$("li")
    if ( args ) {
                if ( isArray ) {
                    for ( ; i < length; i++ ) {
                        value = callback.apply( obj[ i ], args );//apply后面的参数得是个数组
                        if ( value === false ) {//所以在$.each里我们用return false跳出循环
                            break;
                        }
                    }
                } else {
                    for ( i in obj ) {
                        value = callback.apply( obj[ i ], args );
    
                        if ( value === false ) {
                            break;
                        }
                    }
                }
    
            // A special, fast, case for the most common use of each
            } else {
                if ( isArray ) {
                    for ( ; i < length; i++ ) {
                        value = callback.call( obj[ i ], i, obj[ i ] );
    
                        if ( value === false ) {
                            break;
                        }
                    }
                } else {
                    for ( i in obj ) {
                        value = callback.call( obj[ i ], i, obj[ i ] );
    
                        if ( value === false ) {
                            break;
                        }
                    }
                }
            }
    
            return obj;
        }

     实例方法:

    each: function( callback, args ) {
            return jQuery.each( this, callback, args );
        }

     jQuery的实例方法最终也是调用的静态方法,我们在之前就解释过jQuery的实例与原型方法共享的设计。

  • 相关阅读:
    android videoView 加载等待
    LocalBroadcastManager
    sessionStorage 、localStorage
    javascript 数组、json连接
    properties 文件注意事项
    nutz 使用beetl
    [Git/Github] ubuntu 14.0 下github 配置
    【UNIX环境编程、操作系统】孤儿进程和僵尸进程
    【操作系统】进程间通信
    【操作系统】线程
  • 原文地址:https://www.cnblogs.com/darr/p/5133563.html
Copyright © 2011-2022 走看看