如何使用 JavaScript 获取页面当前运行环境-js教程-PHP中文网

最可靠判断javascript运行环境的方式是组合检查全局对象特征与关键api可用性：浏览器需同时满足typeof window !== 'undefined'且window.document可访问；node.js需满足typeof process !== 'undefined'且process.versions?.node存在；deno需存在deno全局对象；web worker则依赖self.constructor.name判别。

要判断 javascript 当前运行环境，核心是通过检查全局对象、api 可用性及特定属性来区分浏览器、node.js、web worker 或 deno 等环境。没有单一 api 能 100% 准确识别所有场景，但组合多个特征可高概率可靠判断。

检查全局对象特征

不同环境暴露的全局对象不同，这是最基础的判断依据：

浏览器环境：存在 window（且 window === this），同时有 document 和 navigator；self 指向 window（主页面）或 WorkerGlobalScope（Worker 中）。
Node.js：存在 globalThis.process 且 process.versions.node 为字符串；globalThis.global 存在，但 window 和 document 为 undefined。
Web Worker：self 存在且 self.constructor.name === 'DedicatedWorkerGlobalScope'（或 SharedWorkerGlobalScope），但 window 为 undefined，document 不存在。
Deno：存在 Deno 全局对象（如 typeof Deno !== 'undefined'），且 globalThis.window 为 undefined，process 不存在。

验证关键 API 是否可用

仅靠全局对象可能不够（例如某些测试环境会模拟 window），需结合典型 API：

Java Maven Code Review

审查Java Maven项目（ZIP压缩包或GitLab仓库URL），检查代码规范、命名、模块边界、可维护性问题以及重复代码。

下载

浏览器：能调用 fetch()、localStorage、location.href、addEventListener；XMLHttpRequest 通常存在。
Node.js：require、__dirname、Buffer、fs 模块可访问（需动态 require('fs') 判断）；fetch 在较新版本中存在，但非原生（由 Node 提供）。
Web Worker：fetch 和 self.postMessage 可用，但无 document、localStorage（除非使用 sharedStorage 等新 API）。

注意陷阱与兼容写法

避免常见误判：

不要只依赖 typeof window !== 'undefined' —— Web Worker 和某些 SSR 渲染上下文（如 Next.js 服务端）中 window 也可能是 undefined，但意图是浏览器环境。
避免用 process 直接判断 Node.js —— Electron 渲染进程也有 process，但它运行在浏览器环境中。
推荐优先使用 globalThis 统一访问全局对象，再结合子属性判断，例如：
if (typeof globalThis.window !== 'undefined' && typeof globalThis.document !== 'undefined') { /* 浏览器 */ }