javascript if (typeof window !== 'undefined') 的目的是什么

What's the purpose of if (typeof window !== 'undefined')

提问by YiFeng

What is the purpose of calling

打电话的目的是什么

if (typeof window !== 'undefined') 

I saw it in JSPM plugin-css, and some other libraries.

我在JSPM plugin-css和其他一些库中看到了它。

回答by Dai

It's an idiomatic check to see if the script is being run in a web-page inside a web-browser or not.

这是一个惯用的检查，以查看脚本是否正在网络浏览器内的网页中运行。

One might assume that JavaScript only runs in web-pages as that's what it was originally designed for, but this isn't true: JavaScript is a versatile language that can also be used for writing server-side code in Node.js or IIS' Active Server Pages (since 1996!), or inside "web workers", which are scripts for web-pages that run in the background.

人们可能会认为 JavaScript 只在网页中运行，因为它最初是为此而设计的，但事实并非如此：JavaScript 是一种通用语言，也可用于在 Node.js 或 IIS 中编写服务器端代码Active Server Pages（自 1996 年以来！），或在“网络工作者”内部，它们是在后台运行的网页脚本。

In a webpage, there are several intrinsic objects, such as window, other environments (like Node.js) won't have windowbut might have other objects like console(well, consolenow exists in most browsers now, but it wasn't originally).

在网页中，有几个内在对象，例如window，其他环境（如 Node.js）不会有window但可能有其他对象，例如console（好吧，console现在大多数浏览器中都存在，但最初不是）。

For example, in different contexts different objects are available in the script's global scope (this list is not exhaustive):

例如，在不同的上下文中，脚本的全局范围内有不同的对象（此列表并不详尽）：

• In all JavaScript contexts a standard set of objects is available, such as:
  • Mathand Date
  • Object, Number, Function, String, etc (objects representing built-in types), etc
• In a web-page's script(inside <script>tags):
  • The Window(interface) is exposed as the windowglobal object, which is also the object that isthe global scope (so declaring var fooin the global scope actually creates a property window.foo!)
  • So the documentglobal-object is actually accessing the window.documentproperty.
• In a Node.js server-side script:
  • As Node.js isn't a web-browser with a DOM there is no windowglobal object nor properties like documentor navigator, but you do get other global objects like:
  • console
  • process
  • exports
• In a web-page's Web Worker script:
  • In a Web Worker there isn't a windowobject either, so instead the global scope is an WindowOrWorkerGlobalScopeobject which exposes objects via properties like:
  • caches
  • indexedDB
  • origin
• In IIS Active Server Pages using JScript (instead of VBScript):
  • response(for writing to the response stream)
  • request(for reading from the incoming HTTP request)
  • Applicationand Session(for persisting data between requests)
• In Microsoft Windows' Shell Script Host
  • The WScriptglobal object exposes functionality from the script host.

• 在所有 JavaScript 上下文中，都有一组标准的对象可用，例如：
  • Math和 Date
  • Object, Number, Function,String等（表示内置类型的对象）等
• 在网页的脚本中（在<script>标签内）：
  • 该Window（接口）被公开为window全局对象，这也是该对象是全球范围内（所以宣布var foo在全球范围内实际创建一个属性window.foo！）
  • 所以document全局对象实际上正在访问该window.document属性。
• 在 Node.js 服务器端脚本中：
  • 由于 Node.js 不是带有 DOM 的 Web 浏览器，因此没有window全局对象，也没有像document或 之类的属性navigator，但您确实可以获得其他全局对象，例如：
  • console
  • process
  • exports
• 在网页的 Web Worker 脚本中：
  • 在 Web Worker 中也没有window对象，因此全局作用域是一个WindowOrWorkerGlobalScope对象，它通过以下属性公开对象：
  • caches
  • indexedDB
  • origin
• 在使用 JScript（而不是 VBScript）的 IIS Active Server Pages 中：
  • response（用于写入响应流）
  • request（用于从传入的 HTTP 请求中读取）
  • Application和Session（用于在请求之间持久化数据）
• 在 Microsoft Windows 的 Shell 脚本宿主中
  • 在WScript全局对象从脚本宿主公开功能。

回答by jfriend00

This can be used to detect whether code is running in a typical browser environment (e.g. an environment with a browser DOM) or in some other JS environment since the windowobject exists in a typical browser JS, but does not exist in something like node.js or even a webWorker in a browser.

这可用于检测代码是在典型的浏览器环境（例如具有浏览器 DOM 的环境）还是在其他一些 JS 环境中运行，因为该window对象存在于典型的浏览器 JS 中，但不存在于诸如 node.js 之类的东西中甚至是浏览器中的 webWorker。

If the windowobject does not exist, then

如果window对象不存在，则

typeof window === 'undefined'

so the code you asked about:

所以你问的代码：

if (typeof window !== 'undefined') 

will execute the ifblock if the windowobject does exist as a top level variable.

if如果window对象确实作为顶级变量存在，则将执行该块。

In the specific code you linked, it is to keep from executing browser-targeted code that references DOM objects like documentif the plugin happens to be used in a non-browser environment.

在您链接的特定代码中，它是为了避免执行引用 DOM 对象的浏览器目标代码，就像document插件碰巧在非浏览器环境中使用一样。