ES5新語法forEach和map及封裝原理


### forEach

  在es5中提供了forEach方法進行遍歷,其實就是模仿了jQuery中each方法,不過將 i 於v進行了調換,下面兩種方法進行對比一下

 var arr = [ 11, 22, 33 ,44,55];
 var res = $.each( arr, function ( i, v ) {
	console.log( i + ', ' + v );
	return false/true;//判斷循環是否結束
});
 console.log( res ); // 返回遍歷的數組


var res = arr.forEach(function ( v, i ) {
	console.log( i + ', ' + v );
	return true;
});
 console.log( res ); // 返回遍歷的數組       

### map  

              var arr = [ 11, 22, 33 ,44];
		var res = arr.map( function ( v, i) {
		       console.log( i + ', ' + v );
			return v * 2;
		});
		console.log( res );//返回新數據

### 封裝

 function forEach( arr, func ) {
    var i;
    // 在 ES5 中還引入了 Array.isArray 的方法專門來判斷數組
    if ( arr instanceof Array || arr.length >= 0) {
        //傳入的是數組
      for ( i = 0; i < arr.length; i++ ) {
        func.call( arr[ i ], arr[ i ],i );
      }
    } else {
      //傳入的是對象
      for ( i in arr ) {
        func.call( arr[ i ],  arr[ i ],i);
      }
    }
    return arr;
  }

 

  function map( arr, func ) {
    var i, res = [], tmp;
    if ( arr instanceof Array || arr.length >= 0 ) {
      for ( i = 0; i < arr.length; i++ ) {
        tmp = func( i,arr[ i ]);
        if ( tmp != null ) {
          res.push( tmp );
        }
      }
    } else {
      for ( i in arr ){
        tmp = func( i,arr[ i ]);
        if ( tmp != null ) {
          res.push( tmp );
        }
      }
    }
    return res;
  } 

  

  


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM