History 对象

window.history属性指向 History 对象，它表示当前窗口的浏览历史。
History 对象保存了当前窗口访问过的所有页面网址。使用history.length来查看当前窗口访问历史记录。

属性

History.length：当前窗口访问过的网址数量（包括当前网页）
History.state：History 堆栈最上层的状态值

方法

History.back()、History.forward()、History.go()

History.back()       // 移动到上一个网址，等同于点击浏览器的后退键
History.forward()    // 移动到下一个网址，等同于点击浏览器的前进键
History.go()         // 接受一个整数作为参数，以当前网址为基准，移动到参数指定的网址，比如go(1)相当于forward()，go(-1)相当于back()。如果参数超过实际存在的网址范围，该方法无效果；如果不指定参数，默认参数为0，相当于刷新当前页面。

点浏览器的返回按钮，到之前访问过的页面时，页面通常是从浏览器缓存之中加载，而不是重新要求服务器发送新的网页。

History.pushState()

用于在历史中添加一条记录。
pushState() 需要三个参数: 一个状态对象, 一个标题 (目前被忽略), 和 (可选的) 一个URL.

• 状态对象 — 状态对象state是一个JavaScript对象，通过pushState () 创建新的历史记录条目。无论什么时候用户导航到新的状态，popstate事件就会被触发，且该事件的state属性包含该历史记录条目状态对象的副本。

• 标题 — Firefox 目前忽略这个参数，但未来可能会用到。在此处传一个空字符串应该可以安全的防范未来这个方法的更改。或者，你可以为跳转的state传递一个短标题。

• URL — 该参数定义了新的历史URL记录。新URL不必须为绝对路径。如果新URL是相对路径，那么它将被作为相对于当前URL处理。新URL必须与当前URL同源，否则 pushState() 会抛出一个异常。该参数是可选的，缺省为当前URL。

注意，调用 pushState() 后浏览器的url会发生变化，但并不会立即加载这个URL。

replaceState()

history.replaceState() 的使用与 history.pushState() 非常相似，区别在于 replaceState() 是修改了当前的历史记录项而不是新建一个。

参考：
https://javascript.ruanyifeng.com/bom/history.html#
https://developer.mozilla.org/zh-CN/docs/Web/API/History_API