浏览器API(小实验):动手整理全部API
winter
该思维导图由 AI 生成,仅供参考
你好,我是 winter。今天我们来讲讲浏览器 API。
浏览器的 API 数目繁多,我们在之前的课程中,已经一起学习了其中几个比较有体系的部分:比如之前讲到过的 DOM 和 CSSOM 等等。但是,如果你留意过,会发现我们讲到的 API 仍然是标准中非常小的一部分。
这里,我们不可能把课程变成一本厚厚的 API 参考手册,所以这一节课,我设计了一个实验,我们一起来给 API 分分类。
我们按照每个 API 所在的标准来分类。所以,我们用代码来反射浏览器环境中全局对象的属性,然后我们用 JavaScript 的 filter 方法来逐步过滤掉已知的属性。
接下来,我们整理 API 的方法如下:
从 Window 的属性中,找到 API 名称;
查阅 MDN 或者 Google,找到 API 所在的标准;
阅读标准,手工或者用代码整理出标准中包含的 API;
用代码在 Window 的属性中过滤掉标准中涉及的 API。
重复这个过程,我们可以找到所有的 API 对应的标准。首先我们先把前面已经讲过的 API 过滤掉。
##JavaScript 中规定的 API
大部分的 API 属于 Window 对象(或者说全局对象),我们可以用反射来看一看现行浏览器中已经实现的 API,我这里使用 Mac 下的 Chrome 72.0.3626.121 版本。
公开
同步至部落
取消
完成
0/2000
荧光笔
直线
曲线
笔记
复制
AI
- 深入了解
- 翻译
- 解释
- 总结
本文通过实验的方式介绍了如何整理浏览器API,并对浏览器环境中全局对象的属性进行分类。作者通过反射浏览器环境中全局对象的属性,并使用JavaScript的filter方法逐步过滤已知的属性,最终整理出各个API所属的标准。文章详细介绍了对JavaScript中规定的API、DOM中的元素构造器、Window对象上的属性以及其他属性的过滤方法,以及对每个标准的查阅和整理过程。通过实际操作,读者可以了解到浏览器API的分类和整理方法,以及对各个API所属标准的查阅过程。整个过程展现了作者对浏览器API整理的深入研究和实践经验,对于想要深入了解浏览器API的读者具有一定的参考价值。文章还提到了不同组织的标准,以及对Web API的理解提升。在面对如此繁复的API时,建议读者在系统掌握DOM、CSSOM的基础上,选择几个API来深入学习。整体而言,本文为读者提供了对浏览器API整理和分类的实用指南,有助于读者更好地理解和应用浏览器环境的API。
仅可试看部分内容,如需阅读全部内容,请付费购买文章所属专栏
《重学前端》,新⼈⾸单¥59
《重学前端》,新⼈⾸单¥59
立即购买
© 版权归极客邦科技所有,未经许可不得传播售卖。 页面已增加防盗追踪,如有侵权极客邦将依法追究其法律责任。
登录 后留言
全部留言(10)
- 最新
- 精选
- CC经过几天的整理,终于穷尽了 Chrome 下的 API。记得之前看别人文章中介绍的各种 API 一头雾水,现在回头看,多了不少熟悉感,而且每个 API 都能落在知识树的一个节点上。 分享整理所得: W3C 标准下的 API: * Web Audio API * Web Cryptography API * Media Source Extensions * The Screen Orientation API * Network Information API * Web MIDI (Musical Instrument Digital Interface ) API * IndexedDB API * Gamepad API * DeviceOrientation Event * Web App Manifest * WebVTT: The Web Video Text Tracks Format * Touch Events * Scalable Vector Graphics (SVG) * Resize Observer API * Intersection Observer * Mutation Observer * Cooperative Scheduling of Background Tasks * Service Worker API * Payment Request API * Presentation API * Web Authentication API WICG 标准下的 API: * Input Device Capabilitie * Web Bluetooth API * WebUSB API ECMA 标准下的 API: * JavaScript 全局变量 * ECMAScript 2018 Internationalization API WHATWG 标准下的 API: * Streams * Encoding * URL Khronos 标准下的 API: * WebGL 未标准化的 API: * Web Background Synchronization * WebRTC API * Document Object Model XPath * Visual Viewport API * Performance Timeline API2019-04-24125
- 阿成整理的过程中,我发现我对翻阅标准的恐惧心降低了... 而且大概了解了一下这些spec都在干些啥(虽然也有很多并不知道他们是在干啥)... 就是花的时间有点长... 都整理完太累了... 有些词实在是检索不到spec,只能在一些犄角旮旯的地方甚至源码里看到引用... 过程中,甚至提升了搜索引擎的使用技巧: 关键词 site:域名 "关键词" 结果如下(肯定有不准确的地方... 仅供参考): https://gist.github.com/aimergenge/c0fb01dbdbf3aa1c2b31e3f2ae779274 tc39,w3c,whatwg 基本就这几个组织在推动web发展.... 另外还有个khronos管openGL、webGL等图形标准的...2019-04-1926
- champ可口可乐了其实,MDN上已经整理好了 https://developer.mozilla.org/en-US/docs/Web/API2020-05-0312
- mfist1. 通过老师的课,感觉慢慢会去翻标准了,之前学习没有见过的API,只是到MDN为止。 2. 浏览器器中大多数的对象都原型继承自Object,是否可以根据原型继承关系 将window上面的api绘制成一颗树?有了这些继承关系 是否更容易理清这些全局属性呢。2019-04-186
- 🐳李小博🐳有一个疑惑是,大小写的两个属性有什么区别 Screen,screen Event,event2019-05-0814
- 余文郁winter老师,问个关于DOM获取的问题,通过querySelectorAll获取的是静态集合,但通过getElementByClassName获取的是动态集合,会随着DOM结构的变化而变化,想这些获取的HTMLCollection和NodeList如何判断是不是动态的呢,以及他们底层的原理是怎么样的呢,为什么会有动态静态之分2019-12-312
- 扩散性百万咸面包说实话,老师这个整理API的学习方法挺好,加深对API的整体理解,对技术也有了更全面的认知。(还可以归个类,大致分分组)以后我学其他技术的时候也用这个办法,快速上手。2020-04-201
- *WHATWG、W3C这两个组织有什么区别啊2022-04-01
- Marvin我过滤到其他API之前还剩下523个,大家呢?2020-08-241
- 李岩醍醐灌顶2020-06-16
收起评论