Iter" />

JavaScript設計模型Iterator實例解析

 更新時間:2020-01-22 11:00:20   作者:佚名   我要評論(0)

這篇文章主要介紹了JavaScript設計模型Iterator實例解析,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下
Iter

這篇文章主要介紹了JavaScript設計模型Iterator實例解析,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下

Iterator Pattern是一個很重要也很簡單的Pattern:迭代器!
我們可以提供一個統一入口的迭代器,Client只需要知道有哪些方法,或是有哪些Concrete Iterator,并不需要知道他們底層如何實作!現在就讓我們來開始吧!

起手式

Iterator最主要的東西就是兩個:hasNext、next。要讓Client知道是否還有下一個,和切換到下一個!

定義Interface

interface IteratorInterface {
  index: number
  dataStorage: any
  hasNext(): boolean
  next(): any
  addItem(item: any): void
}

實作介面

下面的范例我將會使用Map、Array這兩個常見的介面實作。

class iterator1 implements IteratorInterface {
  index: number
  dataStorage: any[]
  constructor() {
    this.index = 0
    this.dataStorage = []
  }
  hasNext(): boolean {
    return this.dataStorage.length > this.index
  }
  next(): any {
    return this.dataStorage[this.index ++]
  }
  addItem(item: any): void {
    this.dataStorage.push(item)
  }
}
// map
class iterator2 implements IteratorInterface {
  index: number
  dataStorage: Map<number, any>
  constructor() {
    this.index = 0
    this.dataStorage = new Map<number, any>()
  }
  hasNext(): boolean {
    return this.dataStorage.get(this.index) != undefined
  }
  next(): any {
    return this.dataStorage.get(this.index ++)
  }
  addItem(item: any): void {
    this.dataStorage.set(this.dataStorage.size, item)
  }
}

Client

我沒有實作一個Client,所以我是直接new一個類別出來直接使用!

const i = new iterator1()
i.addItem(123)
i.addItem(456)
i.addItem('dolphin')
while(i.hasNext()){
  console.log(i.next())
}
console.log(`====================`)
const i2 = new iterator2()
i2.addItem(123)
i2.addItem(456)
i2.addItem('dolphin')
while(i2.hasNext()){
  console.log(i2.next())
}

結論

會發現Iterator 1號 2號的結果都是一樣的!他們都只需要讓Client知道有hasNext、next就好,底層的實作不需要讓他們知道!

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。

您可能感興趣的文章:

  • JSP中c:foreach遍歷和s:iterator遍歷異同實例分析
  • 小議JavaScript中Generator和Iterator的使用
  • 深入解讀JavaScript中的Iterator和for-of循環
  • JavaScript實現Iterator模式實例分析
  • 如何實現java Iterator迭代器功能
  • Java Iterator接口遍歷單列集合迭代器原理詳解
  • PHP設計模式之迭代器(Iterator)模式入門與應用詳解
  • Java集合使用 Iterator 刪除元素
  • Python迭代器iterator生成器generator使用解析

相關文章

  • JavaScript設計模型Iterator實例解析

    JavaScript設計模型Iterator實例解析

    這篇文章主要介紹了JavaScript設計模型Iterator實例解析,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下 Iter
    2020-01-22
  • java GUI編程之paint繪制操作示例

    java GUI編程之paint繪制操作示例

    本文實例講述了java GUI編程之paint繪制操作。分享給大家供大家參考,具體如下: import java.awt.*; public class Testpint { public static void main(Stri
    2020-01-22
  • java GUI編程之布局控制器(Layout)實例分析

    java GUI編程之布局控制器(Layout)實例分析

    本文實例講述了java GUI編程之布局控制器(Layout)。分享給大家供大家參考,具體如下: 布局控制器,是用來系統自動分配各個component在window內部是怎么排布的;默
    2020-01-22
  • Vue設置長時間未操作登錄自動到期返回登錄頁

    Vue設置長時間未操作登錄自動到期返回登錄頁

    Vue設置長時間未操作登錄以后自動到期返回登錄頁 首先我們寫在main.js文件中 import routerUtil from "@/utils/routerutil";//先將js文件在main.js中引入 routerU
    2020-01-22
  • Python @property裝飾器原理解析

    Python @property裝飾器原理解析

    這篇文章主要介紹了Python @property裝飾器原理解析,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下 1.通過@p
    2020-01-22
  • spring cloud gateway整合sentinel實現網關限流

    spring cloud gateway整合sentinel實現網關限流

    這篇文章主要介紹了spring cloud gateway整合sentinel實現網關限流,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參
    2020-01-22
  • python基于property()函數定義屬性

    python基于property()函數定義屬性

    這篇文章主要介紹了python基于property()函數定義屬性,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下 正常情
    2020-01-22
  • vue中js判斷長時間不操作界面自動退出登錄(推薦)

    vue中js判斷長時間不操作界面自動退出登錄(推薦)

    需求說明,后臺有做半個小時不請求接口的話返回標識退出登錄,但是要請求接口才行,現在要實現前端用js判斷半個小時不操作界面的話自動跳轉到登錄頁面。 創建一個.j
    2020-01-22
  • 通過實例解析python描述符原理作用

    通過實例解析python描述符原理作用

    這篇文章主要介紹了通過實例解析python描述符原理作用,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下 本質上
    2020-01-22
  • ES6學習筆記之新增數據類型實例解析

    ES6學習筆記之新增數據類型實例解析

    本文實例講述了ES6學習筆記之新增數據類型。分享給大家供大家參考,具體如下: 1、數據解構賦值 1、數組的解構賦值 基本用法:let [key1,key2...]=[value1,value2..
    2020-01-22

最新評論

买宝宝用品赚钱吗