单页面应用（SPA）路由实现原理

hash： hash 本意是用来作锚点的，方便用户在一个很长的文档里进行上下的导航，用来做 SPA 的路由控制并非它的本意。然而，hash 满足这么一种特性：改变 url 的同时，不刷新页面，再加上浏览器也提供 onhashchange 这样的事件监听，因此，hash 能用来做路由控制。

history：早期的 history 只能用于多页面进行跳转。在 HTML5 规范中，history 新增了以下几个 API history.pushState(); // 添加新的状态到历史状态栈 history.replaceState(); // 用新的状态代替当前状态 history.state // 返回当前状态对象

通过history.pushState或者history.replaceState，也能做到：改变 url 的同时，不会刷新页面。但是onhashchange 可以监听hash的变化，但history的变化无法直接监听，需要通过拦截可能改变history的途径来监听history的变化。可能改变url的方法有三种

点击浏览器前进后退 点击a标签 直接在js中修改路由 第一种可以通过onpopstate事件监听，第二第三其实是一种，a标签的默认事件可以通过js禁止