揭秘 JavaScript 中的数据结构：前端后端必备技能！

2022-11-05 01:09:09

数据结构：前端后端开发的基石

作为一名软件开发者，掌握数据结构是必不可少的技能。无论是在前端还是后端领域，数据结构都能帮助我们高效地组织和处理数据，从而构建出更强大、更可靠的应用程序。

数据结构的类型

在 JavaScript 中，有各种各样的数据结构可供使用，每种结构都有其独特的特性和用途。以下是 JavaScript 中最常见的一些数据结构：

数组：有序元素集合

数组是最基本的数据结构之一，它存储一系列按索引排序的元素。数组可以存储任何类型的数据，包括其他数组和对象。

const arr = [1, 2, 3, 4, 5];
console.log(arr[2]); // 输出：3

对象：键值对集合

对象存储键值对的集合，其中键是字符串，而值可以是任何类型的数据。对象非常适合存储复杂的数据结构，如用户信息或购物车中的商品列表。

const obj = {
  name: 'John',
  age: 30,
  city: 'New York'
};
console.log(obj.name); // 输出：John

链表：线性结构

链表是一种线性数据结构，由一系列称为节点的元素组成。每个节点包含一个数据元素和指向下一个节点的指针。链表特别适合处理大型数据集，因为它可以按需分配内存。

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

class LinkedList {
  constructor() {
    this.head = null;
    this.tail = null;
  }

  add(data) {
    const node = new Node(data);

    if (!this.head) {
      this.head = node;
      this.tail = node;
    } else {
      this.tail.next = node;
      this.tail = node;
    }
  }

  traverse() {
    let current = this.head;

    while (current) {
      console.log(current.data);
      current = current.next;
    }
  }
}

const linkedList = new LinkedList();
linkedList.add(1);
linkedList.add(2);
linkedList.add(3);
linkedList.add(4);
linkedList.traverse();

栈：后进先出（LIFO）

栈是一种后进先出的数据结构，这意味着最后添加的元素将首先被删除。栈广泛用于函数调用和表达式的求值。

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

  push(item) {
    this.items.push(item);
  }

  pop() {
    return this.items.pop();
  }

  peek() {
    return this.items[this.items.length - 1];
  }

  isEmpty() {
    return this.items.length === 0;
  }
}

const stack = new Stack();
stack.push(1);
stack.push(2);
stack.push(3);
console.log(stack.pop()); // 输出：3
console.log(stack.pop()); // 输出：2
console.log(stack.pop()); // 输出：1

队列：先进先出（FIFO）

队列是一种先进先出的数据结构，这意味着第一个添加的元素将首先被删除。队列常用于消息队列和任务调度。

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

  enqueue(item) {
    this.items.push(item);
  }

  dequeue() {
    return this.items.shift();
  }

  peek() {
    return this.items[0];
  }

  isEmpty() {
    return this.items.length === 0;
  }
}

const queue = new Queue();
queue.enqueue(1);
queue.enqueue(2);
queue.enqueue(3);
console.log(queue.dequeue()); // 输出：1
console.log(queue.dequeue()); // 输出：2
console.log(queue.dequeue()); // 输出：3

哈希表：键值对集合（快速查找）

哈希表是一种高效的数据结构，用于快速查找和检索数据。它使用哈希函数将键映射到哈希值，然后将数据存储在相应的哈希桶中。

class HashTable {
  constructor() {
    this.table = new Array(100);
  }

  hash(key) {
    return key % 100;
  }

  add(key, value) {
    const index = this.hash(key);

    if (!this.table[index]) {
      this.table[index] = [];
    }

    this.table[index].push({ key, value });
  }

  get(key) {
    const index = this.hash(key);

    if (!this.table[index]) {
      return null;
    }

    for (let i = 0; i < this.table[index].length; i++) {
      if (this.table[index][i].key === key) {
        return this.table[index][i].value;
      }
    }

    return null;
  }

  remove(key) {
    const index = this.hash(key);

    if (!this.table[index]) {
      return;
    }

    for (let i = 0; i < this.table[index].length; i++) {
      if (this.table[index][i].key === key) {
        this.table[index].splice(i, 1);
        return;
      }
    }
  }

  isEmpty() {
    return this.table.every(bucket => bucket === undefined || bucket.length === 0);
  }
}

const hashTable = new HashTable();
hashTable.add('name', 'John');
hashTable.add('age', 30);
hashTable.add('city', 'New York');
console.log(hashTable.get('name')); // 输出：John
console.log(hashTable.get('age')); // 输出：30
console.log(hashTable.get('city')); // 输出：New York
hashTable.remove('name');
console.log(hashTable.isEmpty()); // 输出：false

集合：不重复元素集合

集合是一种不包含重复元素的数据结构。集合中的元素可以通过元素本身或哈希值来比较。

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

  add(item) {
    if (!this.has(item)) {
      this.items.push(item);
    }
  }

  has(item) {
    return this.items.includes(item);
  }

  remove(item) {
    const index = this.items.indexOf(item);
    if (index !== -1) {
      this.items.splice(index, 1);
    }
  }

  isEmpty() {
    return this.items.length === 0;
  }
}

const set = new Set();
set.add(1);
set.add(2);
set.add(3);
set.add(3);
console.log(set.has(2)); // 输出：true
console.log(set.has(4)); // 输出：false
set.remove(2);
console.log(set.isEmpty()); // 输出：false