当前位置:首页 > JavaScript

js队列实现

2026-04-05 23:13:56JavaScript

队列的基本概念

队列是一种先进先出(FIFO)的数据结构,支持从队尾插入元素(入队),从队头移除元素(出队)。JavaScript中可通过数组或链表实现队列。

基于数组的实现

利用数组的 pushshift 方法模拟队列操作:

class ArrayQueue {
  constructor() {
    this.items = [];
  }

  // 入队
  enqueue(element) {
    this.items.push(element);
  }

  // 出队
  dequeue() {
    if (this.isEmpty()) return "Queue is empty";
    return this.items.shift();
  }

  // 查看队头
  peek() {
    if (this.isEmpty()) return null;
    return this.items[0];
  }

  // 检查是否为空
  isEmpty() {
    return this.items.length === 0;
  }

  // 返回队列大小
  size() {
    return this.items.length;
  }

  // 清空队列
  clear() {
    this.items = [];
  }
}

注意shift() 操作的时间复杂度为 O(n),频繁出队时性能较差。

js队列实现

基于链表的实现

通过链表节点维护队列结构,避免数组移动的开销:

class Node {
  constructor(value) {
    this.value = value;
    this.next = null;
  }
}

class LinkedListQueue {
  constructor() {
    this.head = null;
    this.tail = null;
    this.length = 0;
  }

  // 入队
  enqueue(value) {
    const newNode = new Node(value);
    if (!this.head) {
      this.head = newNode;
      this.tail = newNode;
    } else {
      this.tail.next = newNode;
      this.tail = newNode;
    }
    this.length++;
  }

  // 出队
  dequeue() {
    if (!this.head) return null;
    const removedValue = this.head.value;
    this.head = this.head.next;
    this.length--;
    if (this.length === 0) this.tail = null;
    return removedValue;
  }

  // 查看队头
  peek() {
    return this.head?.value ?? null;
  }

  // 检查是否为空
  isEmpty() {
    return this.length === 0;
  }

  // 返回队列大小
  size() {
    return this.length;
  }
}

优势:链表实现的入队和出队操作均为 O(1) 时间复杂度。

js队列实现

循环队列(优化版)

解决数组实现中空间浪费的问题:

class CircularQueue {
  constructor(capacity) {
    this.items = new Array(capacity);
    this.capacity = capacity;
    this.head = 0;
    this.tail = -1;
    this.size = 0;
  }

  // 入队
  enqueue(element) {
    if (this.isFull()) return false;
    this.tail = (this.tail + 1) % this.capacity;
    this.items[this.tail] = element;
    this.size++;
    return true;
  }

  // 出队
  dequeue() {
    if (this.isEmpty()) return null;
    const element = this.items[this.head];
    this.head = (this.head + 1) % this.capacity;
    this.size--;
    return element;
  }

  // 检查是否为空
  isEmpty() {
    return this.size === 0;
  }

  // 检查是否已满
  isFull() {
    return this.size === this.capacity;
  }
}

适用场景:需要固定大小队列时(如消息缓冲池)。

实际应用示例

任务调度:使用队列管理异步任务顺序执行:

const taskQueue = new ArrayQueue();
taskQueue.enqueue(() => console.log("Task 1"));
taskQueue.enqueue(() => console.log("Task 2"));

while (!taskQueue.isEmpty()) {
  const task = taskQueue.dequeue();
  task(); // 依次输出 "Task 1", "Task 2"
}

标签: 队列js
分享给朋友:

相关文章

js实现vue路由

js实现vue路由

Vue路由基础实现 使用Vue Router实现前端路由需要先安装并配置路由库。Vue Router是Vue.js官方的路由管理器。 安装Vue Router: npm install vue-r…

js实现复制

js实现复制

使用document.execCommand方法 在较旧的浏览器中,可以使用document.execCommand('copy')实现复制功能。创建一个临时的textarea或input元素,将需要…

js实现报表

js实现报表

使用JavaScript实现报表 在JavaScript中实现报表功能可以通过多种方式完成,常见的方法包括使用原生JavaScript、第三方库(如Chart.js、D3.js)或结合后端数据渲染。以…

php 队列的实现

php 队列的实现

PHP 队列的实现方法 使用数据库实现队列 创建一个数据表存储队列任务,包含任务ID、状态、创建时间等字段。通过SQL语句实现任务的入队和出队操作。 // 入队操作 INSERT INTO queu…

js实现二叉树

js实现二叉树

二叉树的基本概念 二叉树是一种树形数据结构,每个节点最多有两个子节点,分别称为左子节点和右子节点。二叉树的常见操作包括插入、删除、遍历等。 二叉树的节点定义 在JavaScript中,二叉树的节点可…

js手势实现

js手势实现

手势识别实现方法 在JavaScript中实现手势识别通常涉及监听触摸事件(touchstart、touchmove、touchend)或鼠标事件(mousedown、mousemove、mouseu…