window.location.href 是 JavaScript 中用于操作浏览器地址栏 URL 的核心属性，其组合结构体现了 JavaScript 的层级对象模型。以下是逐层解析：

---

‌1. window：全局对象‌

• ‌含义‌：代表浏览器窗口或标签页的全局环境，是所有全局变量和函数的容器

• ‌作用‌：通过 window 对象可访问浏览器相关属性和方法（如 alert()、setTimeout()）。

---

‌2. location：URL 管理对象‌

• ‌含义‌：window.location 是 window 的子对象，专门用于操作当前页面的 URL

• ‌关键属性‌：

• href：完整 URL（如 https://example.com/path?query=1#section）

• protocol：协议（如 https:）

• hostname：域名（如 example.com）

• pathname：路径（如 /path）

• search：查询参数（如 ?query=1）

• hash：锚点（如 #section）

---

‌3. href：核心URL属性‌

• ‌含义‌：location.href 是 location 对象的最常用属性，表示当前页面的完整 URL

• ‌功能‌：

• ‌读取‌：获取当前页面 URL（字符串形式）。

• ‌写入‌：赋值后触发页面跳转（如 window.location.href = "https://new.com"）

---

‌组合逻辑解析‌

1. ‌层级关系‌：
   window → location → href 体现 JavaScript 的“对象.子对象.属性”链式访问规则

2. ‌简写形式‌：
   在全局作用域中可省略 window，直接写 location.href（但明确写 window 更规范）

3. ‌设计意图‌：

• window 提供浏览器环境入口。

• location 封装 URL 相关操作。

• href 作为核心属性实现 URL 读写分离

---

‌对比其他类似属性‌

‌属性‌	‌作用‌	‌示例值‌
window.location	返回整个 location 对象	{ href: "...", host: "..." }
location.href	返回或设置完整 URL 字符串	"https://example.com"
location.pathname	仅返回路径部分（不含域名/协议）	"/article"

---

‌常见误区‌

• ‌拼写错误‌：windows.location（错误）→ 正确为 window.location（无 s）

• ‌跳转差异‌：location.href 跳转会保留历史记录，而 location.replace() 不会

通过这种层级设计，JavaScript 实现了对浏览器地址的精细控制。