你其實不用在 JavaScript 實作一個 Queue

刷 LeetCode 的朋友們,應該會發現多數時候 stack 、 queue 能夠解決很多的問題,但你其實可以不用在 JavaScript 實作這樣子的資料結構出來。

撰寫本篇文章的原因:看到有人在解題的討論區用 JavaScript 硬是用 pushpop 寫了一個 Queue 類並且實作了 dequeue 與 enqueue 。但其實如果知道 shiftunshift 或許你可以不用繞這麼遠的路!

Intro.

簡單說說 Queue 的結構 以及 dequeueenqueue 的方法

再來說說 Array 原生方法 shiftunshiftpushpop

Queue是什麼?

Queue 是一個佇列,可以想像我們每次去飲料店排隊的隊伍正是一個 Queue 的結構,採「先到先出」(FIFO)的方式,第一個進來的第一個排出去。

src: W3Cschool

隊伍的尾巴 — 準備進來隊伍尾端的阿宅

隊伍的前頭 — 排隊很久準備點餐阿肥

Enqueue 進來隊伍

Dequeue 離開隊伍

JavaScript 中 Array的 4 個方法介紹

先來一張硬派寫實的圖

用 MacBook 的觸控板繪出來的

添加元素 push & unshift

排出元素 pop & shift

一個關於 Queue 的冥想

/*  There is a 路邊攤隊伍 arr
(隊伍尾巴) 三玖 -> 二乃 -> 一花 -> (攤販商)
*/const arr = ['三玖','二乃','一花'];

今天我們想進去排隊(隊伍尾端),從陣列的開頭添加新元素

arr.unshift('四葉')
console.log(arr)
// ['四葉','三玖','二乃','一花']

今天攤販做完交易後離開隊列,從陣列的尾端排除元素

let person = arr.pop();
console.log(person); // 一花
console.log(arr); // ['四葉','三玖','二乃']

哇靠 這不就 Queue 的結構了

為了充字數我們一起來實作完全沒必要實作的 Queue 吧!

class Queue {
constructor(){
this.queue = []
}
enqueue(val){
this.queue.unshift(val)
}
dequeue(){
return this.queue.pop()
}
}

為了充字數我們一起來實作完全沒必要實作的 Stack 吧!

class Stack {
constructor(){
this.stack = [];
}
push(val){
this.stack.push(val)
}
pop(){
return this.stack.pop()
}
}

打完收工

另外,反過來說你也完全可以用 shiftpush 實作一個 Queue ,就是排隊方向相反的意思。

If any interest, 👉 https://realdennis.me.

If any interest, 👉 https://realdennis.me.