5. history 历史记录对象

history 就是浏览器的前进后退，能控制页面跳转而不刷新。

核心三个：
① history.back()——后退
② history.forward()——前进
③ history.go(-1)——后退 N 步

坑：history 不能拿历史记录 URL、go(0) 刷新、SPA 用 pushState 改 URL 不刷新。

5.1 互动演示（历史长度 + 前进后退）

5.2 知识点讲解

① history 是干什么的？

history 就像浏览器自带的"翻页遥控器"：你点过的页面会按顺序排成一串，back 是"回上一页"、forward 是"去下一页"、go(n) 是"一次跳 n 页"。它只能控制"切到哪一页"，不能偷看历史页面的完整地址（安全限制，防止恶意网站收集你的浏览记录）。

② 三个核心方法 + go 参数规则

// 后退一页，跟你点浏览器左上角那个 ← 一样
window.history.back();

// 前进一页，跟你点浏览器那个 → 一样
window.history.forward();

// 想跳几页跳几页：正数往前、负数往后、0 就是刷新
window.history.go(数字);

// 往前跳 1 页
window.history.go(1);

// 往后退 2 页
window.history.go(-2);

// 啥都不动，把本页刷新一遍
window.history.go(0);

作业里问"history.go(-2) 干嘛"——就是后退两页。回不去时先想是不是用了 location.replace（它不进历史栈）。

③ history.length 与作业里的经典对比题

// 这次打开浏览器以来，一共路过了几页（含本页）
// 对比实验（作业二④）：
window.history.length;

// 从 A 页用 location.href 跳到 B → 历史里还留着 A，按 back 能回去
// 从 A 页用 location.replace 跳到 B → A 被从历史里涂掉，按 back 回不去

replace 跳转不留历史，这是和 href 跳转最核心的差别，也是面试常问点。

本页重点