JavaScript 迭代器模式

2018-08-02 16:26 更新

迭代器模式

迭代器模式中,迭代器(允許我們遍歷集合中所有元素的對象)順序迭代一個集合對象中的元素而無需暴漏其底層形式。

迭代器封裝了這種特別的迭代操作的內(nèi)部結(jié)構(gòu),就jQuery的jQuery.fn.each()迭代器來說,我們實際上可以使用jQuery.each()底層的代碼來迭代一個集合,而無需知道或者理解后臺提供這種功能的代碼是如何實現(xiàn)的。

這種模式可以被理解為門面模式的一種特例,在這里我們只處理與迭代有關(guān)的問題。

$.each( ["john","dave","rick","julian"] , function( index, value ) {
  console.log( index + ": "" + value);
});

$( "li" ).each( function ( index ) {
  console.log( index + ": " + $( this ).text());
});

這里我們可以看到j(luò)Query.fn.each()的代碼:

// Execute a callback for every element in the matched set.
each: function( callback, args ) {
  return jQuery.each( this, callback, args );
}

在jQuery.each()方法后面的代碼提供了兩種迭代對象的方法:

each: function( object, callback, args ) {
  var name, i = 0,
    length = object.length,
    isObj = length === undefined || jQuery.isFunction( object );

  if ( args ) {
    if ( isObj ) {
      for ( name in object ) {
        if ( callback.apply( object[ name ], args ) === false ) {
          break;
        }
      }
    } else {
      for ( ; i < length; ) {
        if ( callback.apply( object[ i++ ], args ) === false ) {
          break;
        }
      }
    }

  // A special, fast, case for the most common use of each
  } else {
    if ( isObj ) {
      for ( name in object ) {
        if ( callback.call( object[ name ], name, object[ name ] ) === false ) {
          break;
        }
      }
    } else {
      for ( ; i < length; ) {
        if ( callback.call( object[ i ], i, object[ i++ ] ) === false ) {
          break;
        }
      }
    }
  }

  return object;
};
以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號