前端路由实现的本质就是监听URL的变化，然后匹配路由规则显示相应的页面，实现方式有2种
可以通过 hashchange 事件来监听URL的变化
Herman 的个人博客
window.addEventListener('hashchange', e => {
console.log(e.newURL, e.oldURL) // 新旧URL
})
History 模式主要使用 history.pushState 和 history.replaceState 改变 URL。
通过 History 模式改变 URL 同样不会引起页面的刷新，只会更新浏览器的历史记录。
// 新增历史记录
history.pushState(stateObject, title, URL)
// 替换当前历史记录
history.replaceState(stateObject, title, URL)
// 监听路由变化
window.addEventListener('popstate', e => {
// e.state 就是 pushState(stateObject) 中的 stateObject
console.log(e.state)
})