在 Vue 中，route 有什么区别？
- router 是 VueRouter 的一个实例，相当于一个全局的路由器对象，里面含有很多属性和子对象，例如history对象等。经常使用的方法有 this.$router.push() 方法和 this.$router.replace()方法等。
- route 相当于当前正在跳转的路由对象，可以从 route 对象获取 name，path，params，query等属性。
说说 Vue-router 的实现原理？
Vue-router 的作用就是采用前端路由系统，通过改变URL，在不重新请求页面的情况下，更新页面视图。
“更新视图但不重新请求页面”是前端路由原理的核心之一，目前在浏览器环境中这一功能的实现主要有两种方式：
- 利用 URL 中的 hash（“#”）;
- 利用 History interface 在 HTML5 中新增的方法。
Vue-router 中一共有三种路由模式（mode,默认是 hash）:
- hash
- history
- abstract
下面只介绍 hash 模式和 history 模式。
HashHistory
hash（“#”）符号的本来作用是加在URL中指示网页中的位置：
#符号本身以及它后面的字符称之为 hash，可通过 window.location.hash 属性读取。它的特点是 hash 虽然出现在 URL 中，但不会被包括在 HTTP 请求中。它是用来指导浏览器动作的，对服务器端完全无用，因此，改变hash不会重新加载页面。 可以为hash的改变添加监听事件：
window.addEventListener("hashchange", funcRef, false)
每一次改变hash（window.location.hash），都会在浏览器的访问历史中增加一个记录。利用hash的以上特点，就可以来实现前端路由“更新视图但不重新请求页面”的功能了。
hash 模式的 push() 方法 => window.location.push() hash 模式的 replace() 方法 => window.location.replace()
HTML5History
History interface是浏览器历史记录栈提供的接口，通过back(), forward(), go() 等方法，我们可以读取浏览器历史记录栈的信息，进行各种跳转操作。 从HTML5开始，History interface提供了两个新的方法：pushState(), replaceState() 使得我们可以对浏览器历史记录栈进行修改。
history 模式的 push() 方法 => window.history.pushState(stateObject, title, URL) history 模式的 replace() 方法 => window.history.replaceState(stateObject, title, URL)
两种模式比较
调用 history.pushState() 相比于直接修改hash主要有以下优势：
- pushState 设置的新 URL 可以是与当前 URL 同源的任意 URL，而 hash 只可修改#后面的部分；
- pushState 设置的新 URL 可以与当前 URL 一模一样，这样也会把记录添加到栈中，而 hash 设置的新值必须与原来不一样才会触发记录添加到栈中；
- pushState 通过 stateObject 可以添加任意类型的数据到记录中，而 hash 只可添加短字符串；
- pushState 可额外设置 title 属性供后续使用。
