JS中使用變量保存arguments對象的方法
迭代器(iterator)是一個可以順序存取數(shù)據(jù)集合的對象。其一個典型的API是next方法。該方法獲得序列中的下一個值。
迭代器示例
題目:希望編寫一個便利的函數(shù),它可以接收任意數(shù)量的參數(shù),并為這些值建立一個迭代器。
測試代碼好下:
var it=values(,,,,,,,,); it.next();// it.next();// it.next();//
分析:由于values函數(shù)需要接收任意多個參數(shù),這里就需要用到上一節(jié)講到的構(gòu)建可變參數(shù)的函數(shù)的方法。然后里面的迭代器對象來遍歷arguments對象的元素。
初步編碼
function values(){ var i=,n=arguments.length; return { hasNext:function(){ return i<n; }, next:function(){ if(this.hasNext()){ return arguments[i++]; } throw new Error("已經(jīng)到達最后啦"); } } }
用上面的測試代碼進行測試
var it=values(,,,,,,,,); it.next();//undefined it.next();//undefined it.next();//undefined
錯誤分析
代碼運行結(jié)果并不正確,下面就對初始的編碼程序進行分析。
function values(){ var i=,n=arguments.length;//這里沒有錯誤,arguments是values里的內(nèi)置對象 return { hasNext:function(){ return i<n; }, next:function(){ if(this.hasNext()){ return arguments[i++];//錯誤出現(xiàn)在這里,arguments是next方法函數(shù)的內(nèi)置對象。 } throw new Error("已經(jīng)到達最后啦"); } } }
這里的指代錯誤,很像是另一個讓人頭痛的對象this。處理this的指向時,通常是使用變量和保存正確的this。然后在其它地方使用這個變量。那么arguments對象的解決方案就出來了,借助一個變量來存儲,這樣arguments對象的指代就沒有問題了。
再次編碼
function values(){ var i=,n=arguments.length,arg=arguments; return { hasNext:function(){ return i<n; }, next:function(){ if(this.hasNext()){ return arg[i++]; } throw new Error("已經(jīng)到達最后啦"); } } }
運行測試代碼
var it=values(,,,,,,,,); it.next();// it.next();// it.next();//
結(jié)果和預(yù)期的相同。
提示
當引用arguments時當心函數(shù)嵌套層級
綁定一個明確作用域的引用到arguments變量,從而可以在嵌套的函數(shù)中引用它
附錄一:迭代器
迭代器(iterator)有時又稱游標(cursor)是程序設(shè)計的軟件設(shè)計模式,可在容器上遍歷的接口,設(shè)計人員無需關(guān)心容器的內(nèi)容。
迭代器UML類圖
迭代器js實現(xiàn)
對設(shè)計模式了解一點點,但具體項目中,有得多的也就是工廠模式,其它很少用,下面是一個簡單的實現(xiàn),不對的地方,歡迎交流。
代碼如下
function List(){ this.data=[]; } List.prototype={ add:function(){ var args=[].slice.call(arguments) this.data=this.data.concat(args); }, remove:function(i){ this.data.splice(i,); }, iterator:function(){ return new Iterator(this); } } function Iterator(list){ this.list=list; this.cur=; }; Iterator.prototype={ hasNext:function(){ return this.cur<this.list.data.length-; }, next:function(){ if(this.hasNext()){ return this.list.data[this.cur++]; } throw new Error('已經(jīng)到底了~'); }, remove:function(){ this.list.remove(this.cur); } } var list=new List(); var it=list.iterator(); list.add(,,,,,,,,); it.next();// it.next();// it.next();//
以上所述是小編給大家介紹的JS中使用變量保存arguments對象的方法,希望對大家有所幫助!
相關(guān)文章
詳細聊聊TypeScript中unknown與any的區(qū)別
unknown類型比較謙虛,就和他本身的意思一樣,他從不禍害到其他的變量,但是any類型就是那種惡霸,屬于什么都不管,誰也不敢管的類型,這篇文章主要給大家介紹了關(guān)于TypeScript中unknown與any區(qū)別的相關(guān)資料,需要的朋友可以參考下2021-10-10javascript實現(xiàn)帶節(jié)日和農(nóng)歷的日歷特效
這篇文章主要介紹了javascript實現(xiàn)帶節(jié)日和農(nóng)歷的日歷特效,效果十分棒,需要的朋友可以參考下2015-02-02javascript中活靈活現(xiàn)的Array對象詳解
本文的內(nèi)容就如同標題一樣,這篇文章將會靈活的運行Array對象的一些方法來實現(xiàn)看上去較復(fù)雜的應(yīng)用。相信對大家學(xué)習(xí)或者理解javascript中的Array對象能具有一定的參考借鑒價值,有需要的朋友們下面跟著小編一起來學(xué)習(xí)學(xué)習(xí)吧。2016-11-113種js實現(xiàn)string的substring方法
這篇文章主要介紹了3種javascript實現(xiàn)string的substring方法,需要的朋友可以參考下2015-11-11全面解析JavaScript中的valueOf與toString方法(推薦)
本文給大家介紹JavaScript中的valueOf與toString方法,valueOf() 方法可返回 Boolean 對象的原始值,toString() 方法可把一個邏輯值轉(zhuǎn)換為字符串,并返回結(jié)果。對js中valueof和tostring相關(guān)知識感興趣的朋友一起學(xué)習(xí)吧2016-06-06javascript移動設(shè)備Web開發(fā)中對touch事件的封裝實例
這篇文章主要介紹了javascript移動設(shè)備Web開發(fā)中對touch事件的封裝實例,分別對tap事件、doubleTap事件、longTap事件、swipe事件做了封裝,需要的朋友可以參考下2014-06-06