前端路由
hash路由
hash路由在html5之前，是解决SPA应用路由跳转问题采用的解决方案。hash变化不会向服务器重新发起请求，并且服务器也无法获取到hash值，所以不会触发页面的重新渲染。前端可以通过监听hashchange事件监听hash值的变化。
//监听hash变化
window.addEventListener('hashchange',function(){
// hash变化后触发hashchange事件，
// 这里做相应操作
})
history路由
是html的规范，提供了对history栈的操作，常用api有:
// 当前history栈顶推送一条记录
/**
* @state 需要传进去的数据state，在触发popstate事件时，可以在event.state里获取到
* @title 标题，基本没用，一般传null
* @url 要推送的新的历史记录url，必须同源。也可以是绝对路径和相对路经，相对当前url。
*/
window.history.pushState(state,title,url)
// 获取当前路由的state
let currentState = history.state;
// 与pushState用法相同，不同的是替换当前历史记录而不是新建历史记录
window.history.replaceState(state,title,url);
window.addEventListener('popstate',function(event){
const state = event.state
// 只能监听到浏览器前进后退引起的url改变，
// pushState和replaceState方法不会触发
})
