如何检查当前运行时环境是否是 JavaScript 中的浏览器?
运行时环境是将执行代码的环境。它告诉您的代码可以访问哪些全局对象，并且还会影响其结果。JavaScript 代码可以在不同类型的环境中运行，其中一些是 Node.js、Service Workers 或 Web 浏览器。因此，要开始使用 JavaScript 编码，您无需安装任何其他软件。每个 Web 浏览器都带有 JavaScript 引擎。您只需在任何浏览器中运行您编写的脚本，但它可确保它遵循 ECMAScript(ES6)功能的所有规则。
在这里，我们将检测我们的代码在哪个运行时环境中运行。用 Node.js 编写的 JavaScript 代码也可以在任何环境中运行，无论是浏览器环境、Service Workers 环境还是 Node.js 环境本身。在不同的环境中运行代码时，您需要满足该环境的所有需求。
检查运行时环境是否为浏览器
要检查代码的运行时环境是否为浏览器，没有直接的方法。因此，要检查运行时环境，我们必须设置一些条件以匹配每个环境，并检查我们的代码在哪个环境中运行。
语法
以下是检查当前运行时环境是否为浏览器的语法 -
窗口类型 === "object"
此处，如果上述语句返回 true，则当前运行环境为浏览器，否则为否。
算法
- 步骤 1 - 检查条件 typeof window === "object"。
- 步骤 2 - 如果返回 true，则显示一条消息，因为当前运行环境为窗口。
- 步骤 2 - 如果返回 false，则显示一条消息，因为当前运行环境不是窗口。
示例
在下面的示例中，我们检查当前运行环境是否为浏览器。
<!DOCTYPE html>
<html>
<body>
<div>
<h2>检查当前运行环境是否为浏览器</h2>
<p>点击下方按钮可查看当前运行环境是否为浏览器</p>
<button onclick = "isBrowser()"> 检查运行环境 </button>
<p id="result1"></p>
<p id="result2"></p>
</div>
<script>
function isBrowser() {
var text="运行时环境";
// 检查运行时环境是否为浏览器
if (typeof window === "object") {
document.getElementById("result1").innerHTML = text + " is Browser";
} else {
document.getElementById("result2").innerHTML = text + " is NOT Browser";
}
}
</script>
</body>
</html>
检查不同的运行时环境
每个环境都有不同的条件。
对于浏览器环境，窗口的类型应等于"对象"。
对于node.js环境，我们必须首先检查两个条件，即检查进程是否为"对象"类型，以及 require 的类型是否为"函数"。
只有当这两个条件都为真时，环境才是node.js 环境。
对于服务工作线程环境，我们检查导入脚本的类型是否等于"函数"或不等于函数时，则只有环境是服务工作者环境。
语法
以下是检查运行时环境的语法 -
// 运行时环境是否为 Node.js 的条件 typeof process === "object" &&typeof require === " // 运行时环境是否为服务工作者的条件 typeof importScripts === "function // 运行时环境是否为浏览器的条件 typeof window === "object"
算法
- 步骤 1 - 首先我们检查运行时环境是否为 Node.js。如果为真，则显示正确的消息。
- 步骤 2 - 接下来我们检查当前运行时环境是否为服务工作者。如果为真，则显示正确的消息。
- 步骤 3 − 最后，我们检查运行时环境是否为浏览器。如果为真，则显示正确的消息。
示例
我们可以使用以下代码来检查程序的运行时环境。
<!DOCTYPE html>
<html>
<body>
<div>
<h2>检查当前运行环境</h2>
<p>点击下方按钮了解运行环境</p>
<button onclick = "isBrowser()"> 检查运行环境 </button>
<p id="result1"></p>
<p id="result2"></p>
<p id="result3"></p>
</div>
<script>
function isBrowser() {
var text="运行时环境";
// 检查运行时环境是否为 Node.js
if (typeof process === "object" &&typeof require === "function") {
document.getElementById("result1").innerHTML = text + "是 node.js"; }
// 检查运行时环境是否为 Service Worker
if (typeof importScripts === "function") {
document.getElementById("result2").innerHTML = text + " 是 service worker";
}
// 检查运行时环境是否为浏览器
if (typeof window === "object") {
document.getElementById("result3").innerHTML = text + " is Browser";
}
}
</script>
</body>
</html>
单击按钮"检查运行时环境"后，屏幕将根据程序运行的环境显示输出。
JavaScript 的这一特性允许您在任何环境中编写代码，并在任何其他不同的环境中运行它，尤其是在使用仅在 Web 浏览器中运行的网页时在 Web 浏览器中运行它。
注意 −此处使用的方法类型将为我们提供变量、函数或方法的数据类型，就像它以字符串、数字、对象、函数或任何其他类型的数据类型给出输出一样。
