前端工作爬坑日记（一）：js监听Android手机物理返回按键

功能需求描述

在工作开发过程中，遇见一个功能需求，要求在页面A.html对Android手机的物理返回按键进行监听，当用户点击物理返回按键时，弹出confirm弹框：用户点击“确定”，跳转至页面B；用户点击取消，仍停留在当前页面，此时点击物理返回按键，依旧弹出confirm弹框，重复上述过程。

实现逻辑

当前，js并没有对应Android手机物理返回按键这一事件的API，无法直接对这一事件进行监听以及后续操作，因此，我们只能通过js的其他方法，来实现近似的效果。这里，我们考虑的是使用history有关的方法来实现。接下来，简要介绍一下本次需要使用的几个方法

1. window.history.pushState(state, title, utl) ：在页面中直接创建一个history实体，并将其添加到历史记录中；
   state：对象，可存储数据，可以通过 history.state方法进行读取；
   title:对应历史记录的标题
   url：创建的历史记录的链接。进行历史记录操作时会跳转到该链接。
2. popstate:history实体被改变时，触发该事件；

具体实现的思路就是，在页面加载时，通过window.history.pushState 方法，创建一个无实际使用意义的history实体。随后，通过addEventLister方法对popstate方法进行进行，并绑定自己想要执行的函数。需要注意的是，这里的addEventListener的 use Capture 参数需要为默认的false，使其在冒泡阶段执行。

在上面创建新的无意义history实体的用处是，由于用户点击Android物理返回按键时，会在触发popstate事件时，销毁最新的history实体，通过创建新的无意义history实