内容简介:焦虑和恐惧的区别是,恐惧是对世界上的存在的恐惧,而焦虑是在"我"面前的焦虑。——萨特《存在与虚无》本文为读 lodash 源码的第十九篇,后续文章会更新到这个仓库中,欢迎 star:
焦虑和恐惧的区别是,恐惧是对世界上的存在的恐惧,而焦虑是在"我"面前的焦虑。
——萨特《存在与虚无》
本文为读 lodash 源码的第十九篇,后续文章会更新到这个仓库中,欢迎 star: pocket-lodash
gitbook也会同步仓库的更新,gitbook地址:pocket-lodash
前言
在前文《 lodash源码分析之获取数据类型
》已经解释了获取数据类型的方法,但是在有些环境下,一些 es6
新增的对象获取到的类型都为 [object Object]
,这样就没办法做细致的区分。例如在 IE11 中,通过 Object.prototype.toString
获取到的 DataView
对象类型为 [object Object]
。 因此在 getTag
中,lodash 针对这些对象做了一些兼容性的事情。
依赖
import baseGetTag from './baseGetTag.js' 复制代码
源码分析
const dataViewTag = '[object DataView]' const mapTag = '[object Map]' const objectTag = '[object Object]' const promiseTag = '[object Promise]' const setTag = '[object Set]' const weakMapTag = '[object WeakMap]' /** Used to detect maps, sets, and weakmaps. */ const dataViewCtorString = `${DataView}` const mapCtorString = `${Map}` const promiseCtorString = `${Promise}` const setCtorString = `${Set}` const weakMapCtorString = `${WeakMap}` let getTag = baseGetTag // Fallback for data views, maps, sets, and weak maps in IE 11 and promises in Node.js < 6. if ((DataView && getTag(new DataView(new ArrayBuffer(1))) != dataViewTag) || (getTag(new Map) != mapTag) || (getTag(Promise.resolve()) != promiseTag) || (getTag(new Set) != setTag) || (getTag(new WeakMap) != weakMapTag)) { getTag = (value) => { const result = baseGetTag(value) const Ctor = result == objectTag ? value.constructor : undefined const ctorString = Ctor ? `${Ctor}` : '' if (ctorString) { switch (ctorString) { case dataViewCtorString: return dataViewTag case mapCtorString: return mapTag case promiseCtorString: return promiseTag case setCtorString: return setTag case weakMapCtorString: return weakMapTag } } return result } } 复制代码
getTag
的源码很简单,处理的是 DataView
、 Map
、 Set
、 Promise
、 WeakMap
等对象,下面就关键的几点说明一下。
函数的toString方法
const dataViewCtorString = `${DataView}` const mapCtorString = `${Map}` const promiseCtorString = `${Promise}` const setCtorString = `${Set}` const weakMapCtorString = `${WeakMap}` 复制代码
我们都知道, DataView
这些其实都是构造函数,函数有 toString
的方法,调用后返回的是 function DataView() { [native code] }
这样的格式,因为其实例调用 Object.prototype.toString
在某些环境下返回的是 [object Object]
,而构造函数的 toString
返回的字符串中,包含了构造函数名,可以通过这点来区分。
实例中构造函数的获取
const Ctor = result == objectTag ? value.constructor : undefined const ctorString = Ctor ? `${Ctor}` : '' 复制代码
每个实例中都包含一个 constructor
的属性,这个属性指向的是实例的构造函数,在获取到这个构造函数后,就可以调用它的 toString
方法,然后就可以比较了。
Promise.resolve
getTag(Promise.resolve()) != promiseTag 复制代码
在条件判断时,使用了 Promise.resolve()
,这样使用的目的是获取到 promise
对象,因为 Promise
是一个函数函数,如果直接调用 Object.prototype.toString
,返回的是 [object Function]
。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网
猜你喜欢:- 谈谈 Java 代码的兼容性
- 开源兼容性测试小工具:WebRTC Troubleshooting
- layui-v2.4.5 兼容性微调
- 我所遇过的移动端兼容性问题
- AmigaOS 3.1.4.1 发布,兼容性提高
- Angular 浏览器兼容性问题解决方案
本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。
JavaScript快速开发工具箱
Robin Nixon / 陈武、姚飞 / 清华大学出版社 / 2011-11 / 59.00元
《JavaScript快速开发工具箱:轻松解决JavaScript日常编程问题的100个插件工具》通透讲解100个现成的JavaScript插件,引导您使用这些利器得心应手地创建动态Web内容。《JavaScript快速开发工具箱:轻松解决JavaScript日常编程问题的100个插件工具》开篇讲解JavaScript、CSS和DOM,此后每章都列举一个完整示例,指导您将特定效果快速应用于网页。使......一起来看看 《JavaScript快速开发工具箱》 这本书的介绍吧!