欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

ES6 Iterator接口和for...of循環(huán)用法分析

 更新時間：2019年07月31日 09:49:57   作者：xiaxiaoxian  
這篇文章主要介紹了ES6 Iterator接口和for...of循環(huán)用法,結合實例形式分析了Iterator接口和for...of循環(huán)相關使用技巧,需要的朋友可以參考下

本文實例講述了ES6 Iterator接口和for...of循環(huán)用法。分享給大家供大家參考，具體如下：

<script>
// 數(shù)組已經幫我們內置這個Iterator接口
let arr = ['hello','world'];
let map = arr[Symbol.iterator](); // 數(shù)組直接調用iterator接口，返回一個對象map
console.log(map.next()); // {value: "hello", done: false} done:循環(huán)沒有下一步狀態(tài)：true沒有，false:有狀態(tài)，循環(huán)并沒有結束
console.log(map.next()); // {value: "world", done: false}
console.log(map.next()); // {value: undefined, done: true}
</script>

運行結果：

for...of循環(huán)，就是不斷的調用Iterator接口。

object數(shù)據(jù)結構沒有實現(xiàn)Iterator接口。

自定義實現(xiàn)object的Iterator接口

<script>
let obj ={
  start: [1,5,7],
  end:[8,4,3],
  [Symbol.iterator](){
   let self = this;
   let index = 0;
   let arr = self.start.concat(self.end);
   let len = arr.length;
   return {
    next(){
     if(index<len){
      return{
       value:arr[index++],
       done:false
      }
     }else{
      return {
       value:arr[index++],
       done:true
      }
     }
    }
   }
  }
}
for(let key of obj){ // for...of 背后用的就是iterator接口
  console.log(key); // 1 5 7 8 4 3
}
</script>

運行結果：

<script>
let arr = ['xixiaoxian','jamin'];
for(let value of arr){
  console.log(value); // xixiaoxian  jamin
}
</script>

運行結果：

感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運行工具：http://tools.jb51.net/code/HtmlJsRun測試上述代碼運行效果。

更多關于JavaScript相關內容可查看本站專題：《javascript面向對象入門教程》、《JavaScript錯誤與調試技巧總結》、《JavaScript數(shù)據(jù)結構與算法技巧總結》、《JavaScript遍歷算法與技巧總結》及《JavaScript數(shù)學運算用法總結》

希望本文所述對大家JavaScript程序設計有所幫助。

相關文章

  • Javascript 刷新全集常用代碼

    Javascript 刷新全集常用代碼

    Javascript刷新頁面實現(xiàn)代碼，需要的朋友可以參考下。
    2009-11-11
  • Echats圖表大屏自適應的實現(xiàn)方法

    Echats圖表大屏自適應的實現(xiàn)方法

    很多時候我們需要用圖表來制作我們統(tǒng)計的數(shù)據(jù)直觀的分析,所以我們可以用Echarts來制作圖表,這篇文章主要給大家介紹了關于Echats圖表大屏自適應的實現(xiàn)方法,需要的朋友可以參考下
    2021-10-10
  • 微信小程序左右滑動的實現(xiàn)代碼

    微信小程序左右滑動的實現(xiàn)代碼

    這篇文章主要介紹了微信小程序左右滑動的實現(xiàn)代碼,非常不錯，具有參考借鑒價值，需要的朋友可以參考下
    2017-12-12
  • 分享50個超級有用的JavaScript單行代碼(推薦!)

    分享50個超級有用的JavaScript單行代碼(推薦!)

    JavaScript是一種腳本語言,是直接在瀏覽器運行的,下面這篇文章主要給大家介紹了50個超級有用的JavaScript單行代碼的相關資料,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下
    2023-01-01
  • HTML使用js給input標簽增加disabled屬性的方法

    HTML使用js給input標簽增加disabled屬性的方法

    最近項目上提出一個經常遇到的需求,點擊新增時input可輸入,點擊編輯時input置灰,下面這篇文章主要給大家介紹了關于HTML使用js給input標簽增加disabled屬性的相關資料,需要的朋友可以參考下
    2024-06-06
  • js中使用DOM復制（克隆）指定節(jié)點名數(shù)據(jù)到新的XML文件中的代碼

    js中使用DOM復制（克?。┲付ü?jié)點名數(shù)據(jù)到新的XML文件中的代碼

    使用DOM復制（克?。┲付ü?jié)點名數(shù)據(jù)到新的XML文件中 ,用到三個類的相關知識點 ： DOMDocument - DOMNodeList - DOMNode
    2011-07-07
  • JavaScript對象擴展方法的用法詳解

    JavaScript對象擴展方法的用法詳解

    JavaScript對象中的可擴展性指的是：是否可以給對象添加新屬性。所有的內置對象和自定義對象顯示的都是可擴展的，對于宿主對象，則由JavaScript引擎決定
    2022-11-11
  • 禁止你的左鍵復制實用技巧

    禁止你的左鍵復制實用技巧

    左鍵復制對于所有人來說有好有壞，例如原創(chuàng)內容就不想被別人復制，接下來介紹一種方法，有需要的朋友可以參考下
    2013-01-01
  • js觸發(fā)asp.net的Button的Onclick事件應用

    js觸發(fā)asp.net的Button的Onclick事件應用

    由于asp.net采用的是事件驅動模式，所以默認用戶按回車并沒有觸發(fā)按鈕的onclick事件。用戶按回車也不是沒有提交表單，通過httpwath可以看到，實際上頁面表單是提交到了form下的action頁面，只不過沒有觸發(fā)onclick事件而已,感興趣的朋友可以了解下，或許對你有所幫助
    2013-02-02
  • 超漂亮的Bootstrap 富文本編輯器summernote

    超漂亮的Bootstrap 富文本編輯器summernote

    Summernote 是一個簡單，靈活，所見即所得（WYSIWYG）的編輯器，基于 jQuery 和 Bootstrap 構建。對bootstrap 文本編輯器相關知識感興趣的朋友一起學習吧
    2016-04-04

最新評論