用數(shù)組建立一個簡單的循環(huán)

pkhope 發(fā)布于2019-08-20 10:12 / 2687人閱讀

摘要：有時我們需要不停的循環(huán)數(shù)組的元素，就像一組旋轉的圖片，或者音樂的播放列表。這里告訴你如何使一個數(shù)組擁有循環(huán)的能力返回當前的元素第一次檢查更新第二次檢查更新返回元素增加然后返回新的當前元素減少然后返回新的當前元素使用取模操作符更優(yōu)雅。

有時我們需要不停的循環(huán)數(shù)組的元素，就像一組旋轉的圖片，或者音樂的播放列表。這里告訴你如何使一個數(shù)組擁有循環(huán)的能力：

var aList = ["A","B","C","D","E"];

function make_looper( arr ){

    arr.loop_idx = 0;

    // 返回當前的元素
    arr.current = function(){

      if( this.loop_idx < 0 ){// 第一次檢查
        this.loop_idx = this.length - 1;// 更新 loop_idx
      }

      if( this.loop_idx >= this.length ){// 第二次檢查
        this.loop_idx = 0;// 更新 loop_idx
      }

      return arr[ this.loop_idx ];//返回元素
    };
    
    // 增加 loop_idx 然后返回新的當前元素
    arr.next = function(){
      this.loop_idx++;
      return this.current();
    };
    // 減少 loop_idx 然后返回新的當前元素
    arr.prev = function(){
      this.loop_idx--;
      return this.current();
    };
}

make_looper( aList);

aList.current();// -> A
aList.next();// -> B
aList.next();// -> C
aList.next();// -> D
aList.next();// -> E
aList.next();// -> A
aList.pop() ;// -> E
aList.prev();// -> D
aList.prev();// -> C
aList.prev();// -> B
aList.prev();// -> A
aList.prev();// -> D

使用?%?( 取模 ) 操作符更優(yōu)雅。取模返回除法的余數(shù) (?2 % 5 = 1?and?5 % 5 = 0)：

var aList = ["A","B","C","D","E"];


function make_looper( arr ){

    arr.loop_idx = 0;

    // return current item
    arr.current = function(){
      this.loop_idx = ( this.loop_idx ) % this.length;// 無需檢查 !!
      return arr[ this.loop_idx ];
    };

    // 增加 loop_idx 然后返回新的當前元素
    arr.next = function(){
      this.loop_idx++;
      return this.current();
    };
    
    // 減少 loop_idx 然后返回新的當前元素
    arr.prev = function(){
      this.loop_idx += this.length - 1;
      return this.current();
    };
}

make_looper( aList);

aList.current();// -> A
aList.next();// -> B
aList.next();// -> C
aList.next();// -> D
aList.next();// -> E
aList.next();// -> A
aList.pop() ;// -> E
aList.prev();// -> D
aList.prev();// -> C
aList.prev();// -> B
aList.prev();// -> A
aList.prev();// -> D

轉載自：http://www.jstips.co

GPU云服務器云服務器 php一個數(shù)組的長度一個ASP中的數(shù)組 js 把一個數(shù)組的值簡單的小程序開發(fā)用什么

文章版權歸作者所有，未經(jīng)允許請勿轉載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/80038.html

JS數(shù)組關聯(lián)查找的性能優(yōu)化

摘要：傳統(tǒng)個數(shù)組的嵌套查詢一般通過兩個循環(huán)體嵌套實現(xiàn)，時間復雜度為而通過建立索引對象的形式的時間復雜度為這種犧牲內(nèi)存來達到復雜度降冪的的方法能提高多少性能呢下面是以數(shù)組長度為數(shù)組為的亂序數(shù)組進行測試的測試結果。傳統(tǒng)2個數(shù)組的嵌套查詢一般通過兩個循環(huán)體嵌套實現(xiàn)，時間復雜度為:n^2; 而通過建立索引對象的形式的時間復雜度為：n;這種犧牲內(nèi)存來達到復雜度降冪的的方法能提高多少性能呢？下面是以...

Stardustsky 2019-08-23 12:11 評論0 收藏0
PHP的優(yōu)化Tips

摘要：是個巨大的資源庫，很多開發(fā)者都知道使用能自動打印一份很好格式化的頁面源代碼的副本使用函數(shù)來預防潛在的敏感信息顯示給用戶。理想的錯誤報告應該被完全禁用在文件里。優(yōu)化語句，盡量少進行。 Celebrate what youve accomplished, but raise the bar a little higher each time you succeed. 如果一個方法能被靜...

趙春朋 2019-06-27 12:03 評論0 收藏0
微信小程序入門教程--列表渲染多層嵌套循環(huán)及wx:key的使用

摘要：前言入門教程之列表渲染多層嵌套循環(huán)，目前官方的文檔里，主要是一維數(shù)組列表渲染的案例，還是比較簡單單一，給剛入門的童鞋還是無從入手的感覺。我們也會不定期發(fā)布一些微信小程序的學習教程。需要入群的小伙伴，請加我的個人微信。前言入門教程之列表渲染多層嵌套循環(huán)，目前官方的文檔里，主要是一維數(shù)組列表渲染的案例，還是比較簡單單一，給剛入門的童鞋還是無從入手的感覺。 {{index}}: {...

tracy 2019-08-02 15:56 評論0 收藏0
微信小程序入門教程--列表渲染多層嵌套循環(huán)及wx:key的使用

摘要：前言入門教程之列表渲染多層嵌套循環(huán)，目前官方的文檔里，主要是一維數(shù)組列表渲染的案例，還是比較簡單單一，給剛入門的童鞋還是無從入手的感覺。我們也會不定期發(fā)布一些微信小程序的學習教程。需要入群的小伙伴，請加我的個人微信。前言入門教程之列表渲染多層嵌套循環(huán)，目前官方的文檔里，主要是一維數(shù)組列表渲染的案例，還是比較簡單單一，給剛入門的童鞋還是無從入手的感覺。 {{index}}: {...

Luosunce 2019-08-20 12:35 評論0 收藏0