動態

詳情 返回 返回

刷題前必學!棧與隊列!用JavaScript學數據結構與算法 - 動態 詳情

🧑‍💻JavaScript數據結構與算法-HowieCong

務必要熟悉JavaScript使用再來學!

一、數組增刪操作

  • 在瞭解棧和隊列前,明確數組中的增刪操作具有什麼樣的特性、對應的方法有哪些:

    • 靈活增刪的數組

      • 數組增加元素的三種方法:

        1. unshift方法,添加元素到數組的頭部
        const arr = [1,2]
        arr.unshift(0) // [0,1,2]
        1. push方法,添加元素到數組的尾部
        const arr = [1,2]
        arr.push(3) // [1,2,3]
        1. splice方法,添加元素到數組的任何位置,splice第一個入參是起始的索引值,第二個入參表示起始索引開始需要刪除的元素個數,第三個位置開始的入參,代表需要添加到數組裏的元素的值,下面的例子,指向arr[1]開始,刪掉0個元素,在索引為1的地方新增了值為3的元素,把原來的arr[1]擠到後面去。
        const arr = [1,2]
        arr.splice(1,0,3) // [1,3,2]

        image.png

      • 數組中刪除元素的三種方法:

        1. shift方法:刪除數組頭部的元素
        const arr = [1,2,3]
        arr.shift() // [2,3]
        1. pop方法:刪除數組尾部的元素
        const arr = [1,2,3]
        arr.pop()// [2,3]
        1. splice方法:刪除數組任意位置的元素,如上文

二、棧(Stack)

1. 定義

  • 只有pop和push完成增刪的“數組”
  • 棧是一種後進先出(LIFO,Last In First Out)的數據結構
  • 類似小賣部的冰激凌櫃,先放進去的雪糕,壓在最下面,我也很難拿到底部放的雪糕,一般看到表面有啥喜歡吃的雪糕就拿了,老闆越晚放進去的雪糕,就越先拿出來;越是先放進去的,越是最後被取出來

2. 特徵

  • 只允許從尾部添加元素
  • 只允許從尾部取出元素
  • 對應數組的方法,就是pop和push,就可以認為在JavaScript裏面,棧就是限制只能使用push來添加元素,同時只能用pop來刪除元素的一種特殊數組

3. 棧的常用操作

  • 老闆把雪糕放進冰激凌櫃
// 初始化,棧為空
const stack = []
// 入棧過程(雪糕入冰激凌櫃)
stack.push('巧樂茲')
stack.push('可愛多')
stack.push('奶轉')
  • 老闆賣雪糕
while(stack.length){
    // 訪問棧的頂元素(不出棧)
    const top = stack[stack.length-1]
    console.log('現在取出的冰激凌是',top)
    // 將棧頂元素出棧
    stack.pop()
}

// 棧空
stack // []
  • 輸出結果

image.png

三、隊列(Queue)

1. 定義

  • 只用push和shift完成增刪的“數組”
  • 隊列是一種先進先出(FIFO,Fist In First Out)的數據結構
  • 類似我們去麥當勞點餐,先點餐的人先出餐,後點餐的人後出餐

2. 特徵

  • 只允許從尾部添加元素
  • 只允許從頭部移除元素
  • 對於數組來説,只涉及到了數組的push和shift方法;在棧元素出棧時,我們關心的是數組最後一個元素;隊列元素出隊,我們關心的是隊伍頭元素,即數組的第一個元素

3. 隊列的常用操作

  • 在App點“窮鬼套餐”
// 初始化,隊列為空
const queue = []
// 添加元素(點窮鬼套餐的人)
queue.push('HowieCong')
queue.push('吳彥祖')
queue.push('喬一魚')
  • HowieCong取“窮鬼套餐”
while(queue.length){
    // 訪問隊列頭部元素(不出隊)
    const top = queue[0]
    console.log(top,'取餐')
    // 將隊頭元素出隊
    queue.shift()
}

// 隊空
queue // []
  • 輸出結果

image.png

❓其他

1. 疑問與作者HowieCong聲明

  • 如有疑問、出錯的知識,請及時點擊下方鏈接添加作者HowieCong的其中一種聯繫方式或發送郵件到下方郵箱告知作者HowieCong
  • 若想讓作者更新哪些方面的技術文章或補充更多知識在這篇文章,請及時點擊下方鏈接添加里面其中一種聯繫方式或發送郵件到下方郵箱告知作者HowieCong
  • 聲明:作者HowieCong目前只是一個前端開發小菜鳥,寫文章的初衷只是全面提高自身能力和見識;如果對此篇文章喜歡或能幫助到你,麻煩給作者HowieCong點個關注/給這篇文章點個贊/收藏這篇文章/在評論區留下你的想法吧,歡迎大家來交流!

2. 作者社交媒體/郵箱-HowieCong

  • HowieCong Social Meida : Wechat|Instagram|Feishu|Juejin|Segementfault...
  • HowieCong Mail : mailto:howiecong@163.com
user avatar wu_cat 頭像 haoqingwanqiandesigua 頭像 chaoqiezi 頭像 axuicn 頭像 wenweneryadedahuoji 頭像 ohaha 頭像 kaiwudb 頭像 aurora700 頭像 laoshideyangrouchuan 頭像 gvenusleo 頭像 yingyongwubidehuoguo_z2xiu 頭像 youyudeshuanggang 頭像
點贊 24 用戶, 點贊了這篇動態!
點贊

Add a new 評論

Some HTML is okay.