面试复习-js路由原理

面试复习-js路由原理

参考链接
https://www.cnblogs.com/tugenhua0707/p/10859214.html
https://www.jianshu.com/p/4295aec31302
为什么会有前端路由
后端路由有一个很大的缺点就是每次路由切换的时候都需要去刷新页面，然后发出ajax请求，然后将请求数据返回回来，那么这样每次路由切换都要刷新页面对于用户体验来说就不好了。因此为了提升用户体验，我们前端路由就这样产生了。它就可以解决浏览器不会重新刷新了。

Hash模式

hash路由模式是这样的：http://xxx.abc.com/#/xx。 有带#号，后面就是hash值的变化。**改变后面的hash值，它不会向服务器发出请求，因此也就不会刷新页面。**并且每次hash值发生改变的时候，会触发hashchange事件。因此我们可以通过监听该事件，来知道hash值发生了哪些变化。

function hashAndUpdate () {
   
   // todo 匹配 hash 做 dom 更新操作
}
window.addEventListener('hashchange', hashAndUpdate)