JavaScript-浏览器是否在当前页面监听事件(页面切入切出事件监听)

最近在做项目的时候碰到需要监听浏览器是否处于当前页面,即需要监听页面的切入及切出
使用页面可见性改变事件visibilitychange
可能使用的场景:
1.页面使用自动轮播时,如果不监听页面的切入切出,如果长时间切出后再次切入进来,会造成轮播图快速的切换很多次,影响用户体验
2.当页面有视频,音频等时,当需要在页面切出时进行暂停或者关闭
3.其它动态自动更新的板块,当需要在页面切出时暂停更新,重新切入时进行更新

// 监听是否在当前页
document.addEventListener("visibilitychange", function () {
  if (!document.hidden) {  
    // 处于当前页面
    console.log("页面切入,浏览器处于当前页面")
  }else{
  	// 页面切出,不处于当前页面
  	 console.log("页面切出,浏览器不处于当前页面")
  }
});