JavaScript_02面向物件程式設計(原型【四】)自己實現each方法可遍歷多維陣列
阿新 • • 發佈:2018-11-15
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>New Web Project</title> <script type="text/javascript" charset="UTF-8"> /* * 原型的另外一個作用就是擴充套件物件中的屬性和方法: * 1.模擬Array中each迴圈方法。 * * 2.foreach * */ //Array each方法 //ECMA5 forEach 迴圈遍歷陣列的每一項。 //var arr=[1,2,3,[4,5]];ECMA5只適合遍歷一維陣列。 /* var arr=[1,2,3,4,5]; arr.forEach(function(item,index,array){ alert(item); }); */ //自己實現一個Array each方法,能遍歷多維陣列。 var arr = [1,2,3,[4,[5,[6]]]];//arr.length Array.prototype.each=function(fn){ try{ //1.目的:遍歷陣列的每一項。 // var i = 0;//計算器,記錄當前遍歷的元素位置. this.i || (this.i=0); //2.嚴謹判斷什麼時候走each核心方法; //當陣列長度>0,並且傳遞的引數必須為函式. if(this.length>0 && fn.constructor==Function){ //迴圈遍歷陣列的每一項 while(this.i<this.length){//遍歷while迴圈的範圍 //核心程式碼:獲取陣列的每一項 var e=this[this.i]; //如果當前元素獲取到了,且當前元素是一個數組。 if(e && e.constructor==Array){ //直接做遞迴操作。 e.each(fn); }else{ //如果不是陣列(那就是一個單個元素) //fn(e); // var obj=true; //fn.apply(obj,[e]); //這個目的就是為了把陣列的當前元素傳遞給fn函式,並讓函式執行。 //fn.apply(e,[e]);//節省記憶體 fn.call(e,e); } this.i++; } this.i=null;//釋放記憶體,垃圾回收機制回收變數 } }catch(ex){ //do something } retrun this; } arr.each(function(item){ alert(item); }) </script> </head> <body> <h1>New Web Project Page</h1> </body>