作为一名前端爱好者，笔者利用业余时间研究了几个国外网站的源代码，发现无论是库还是业务代码都使用了一些有趣的API。虽然在工作中接触过一些，但是经过这次研究，觉得还是有必要总结一下的。毕竟都2020年了，也到了更新技术储备的时候了。本文主要通过实际案例带大家快速了解以下知识点：Observer原生观察者。脚本标签事件深入-删除脚本标签后事件仍然执行的原因。代理/反射。自定义事件。文件读取器API。全屏网页全屏。URLAPI的使用。地理定位地理定位API的使用。通知浏览器本机消息通知。电池状态设备的电池状态。我会针对一些API做一些有趣的案例，开始我们的学习吧~1.ObserverAPIObserver是浏览器自带的观察者。它主要提供四种类型的观察者：Intersection、Mutation、Resize、Performance。这里作者重点介绍IntersectionObserver。1、IntersectionObserverIntersectionObserver提供了一种异步观察目标元素与其祖先元素相交状态的方法。IntersectionObserver对象在创建时配置为监听根中给定比例的可见区域，且其配置不可更改，因此给定的观察者对象只能用于监听可见区域的特定变化；但是，我们可以配置为在同一个观察者对象中监视多个目标元素。简单来说，api可以异步监听目标元素在根元素中的位置变化，并触发响应事件。我们可以用它来实现更高效的图片延迟加载、无限滚动和内容上报。下面我们用一个例子来说明它的使用步骤。//1.定义观察者并观察回调constintersectionObserver=newIntersectionObserver((entries,observer)=>{entries.forEach(entry=>{console.log(entry)//...一些操作});},{root:document.querySelector('#root'),rootMargin:'0px',threshold:0.5})//2.定义要观察的目标对象consttarget=document.querySelector(“.target”);intersectionObserver.observe（目标）;上面的代码实现了一个基本的IntersectionObserver，虽然现有的代码并没有体现出任何实质性的功能。接下来介绍一下代码中使用的参数的含义：callbackIntersectionObserver实例的第一个参数，当目标元素和根元素通过阈值时
