请实现一个简单的前端路由系统，支持路由匹配和导航功能。

Question

Accepted Answer

实现一个简单的前端路由系统，主要包括路由匹配和导航功能。首先，定义一个路由表，存储路由路径和对应的处理函数。可以使用一个对象来表示路由表，键为路由路径，值为处理函数。然后，监听浏览器的 hashchange 事件，当 URL 的 hash 值发生变化时，根据新的 hash 值在路由表中查找对应的处理函数，并执行该函数。以下是一个简单的实现示例：
javascript
class Router {
  constructor() {
    this.routes = {};
    window.addEventListener('hashchange', this.handleHashChange.bind(this));
  }

addRoute(path, handler) {
    this.routes[path] = handler;
  }

handleHashChange() {
    const hash = window.location.hash.slice(1);
    const handler = this.routes[hash];
    if (handler) {
      handler();
    }
  }
}

// 使用示例
const router = new Router();
router.addRoute('home', () => console.log('Home page'));
router.addRoute('about', () => console.log('About page'));

在这个示例中，Router 类封装了路由系统的核心功能，addRoute 方法用于添加路由，handleHashChange 方法用于处理 hashchange 事件。通过这种方式，可以实现简单的路由匹配和导航功能。