1. 背景
当 HTML 渲染到浏览器之后,会以我们常说的 DOM 结构呈现出来;而 document对象可以对这些 DOM 节点进行各种操作。
值得一提的是,如果 不是在浏览器中运行 JavaScript 代码,document 打印出来会是一个 undefined 并直接报错。
本期源码非常简单,来看看 xe-uitils 源码中是如何对 document 进行判断的!
2. 源码解析
2.1 xe-utils 源码实现 isDocument.js
源码思路:
当对象存在,且当前环境存在 document 对象,并且当前节点类型的值为 9(9 代表 document 对象,详见 2.3),即可判断为 document 对象
var staticDocument = require('./staticDocument')
/**
* 判断是否 Document 对象
* @description nodeType=9 时代表 Document 对象
* @param {*} obj
* @returns
*/
function isDocument(obj) {
return !!(obj && staticDocument && obj.nodeType === 9)
}
module.exports = isDocument
备注:
staticDocument:实际上是做了当前环境是否存在document对象的判断,源码见下2.2nodeType:标识了当前DOM节点的类型,详见2.3- 使用
!!来强制转换为布尔类型,效果等同于Boolean(obj)
2.2 staticDocument 源码
源码思路:
判断 document 类型是否为 undefined(staticStrUndefined 即为 undefined 常量,这里作者做了封装),若是则返回布尔值为否的0,否则返回 document对象
var staticStrUndefined = require('./staticStrUndefined')
/* elint-disable valid-typeof */
var staticDocument = typeof document === staticStrUndefined ? 0 : document
module.exports = staticDocument
2.3 nodeType 包含哪些类型
通过这个源码,也帮助我们复习了一下平时少用的 nodeType 中,查阅 w3school 可以看到其值对应的哪些节点类型
显然,当 nodeType = 9 时,即为 document 对象。

