2. 链表（Linked List）

2. 链表（Linked List）

示例场景：创建一个简单的链表组件，允许用户添加和删除节点。

首先定义一个链表节点类：

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

然后创建一个 React 组件来管理链表：

import React, { useState } from "react";

function LinkedListComponent() {
  const [head, setHead] = useState(null);
  const [inputValue, setInputValue] = useState("");

  // 添加节点
  const addNode = (value) => {
    const newNode = new ListNode(value);
    if (!head) {
      setHead(newNode);
    } else {
      let current = head;
      while (current.next) {
        current = current.next;
      }
      current.next = newNode;
    }
  };

  // 删除节点
  const deleteNode = (value) => {
    if (!head) return;

    if (head.value === value) {
      setHead(head.next);
      return;
    }

    let current = head;
    while (current.next && current.next.value !== value) {
      current = current.next;
    }

    if (current.next) {
      current.next = current.next.next;
    }
  };

  // 渲染链表
  const renderList = () => {
    const nodes = [];
    let current = head;
    while (current) {
      nodes.push(current.value);
      current = current.next;
    }
    return nodes.join(" -> ");
  };

  return (
    <div>
      <input
        type="text"
        value={inputValue}
        onChange={(e) => setInputValue(e.target.value)}
      />
      <button onClick={() => addNode(inputValue)}>添加节点</button>
      <button onClick={() => deleteNode(inputValue)}>删除节点</button>
      <p>链表: {renderList()}</p>
    </div>
  );
}

export default LinkedListComponent;