这是 JavaScript 吗？

OH：这只是 JavaScript 吧？我懂 JavaScript。我的同事今天剩下的时间肯定要用来调试一个 Electron 问题——@jonkuperman.com 在 BlueSky

“这只是 JavaScript！”你可能听过这句话。我本人也用过很多次。这句话经常被用来暗示某个项目易于上手，因为它可以用我们都熟悉和喜爱的通用标准化脚本语言——JavaScript——来实现。将你在浏览器中移动像素的经验，应用到运行服务器和查询数据库上。你可以用同一种语言实现这两者，这就是 JavaScript！但等等，JavaScript 到底是什么？任何写在 .js 文件中的代码都是”只是 JavaScript”吗？让我们玩一个我称之为”这是 JavaScript 吗？”的小游戏。

图0：这是 JavaScript 吗？

浏览器 JavaScript

let el = document.querySelector("#root")；
window.location = "https://www.webhek.com"；

这是 DOM 相关操作，即浏览器 API。这是 JavaScript 吗？”如果它在浏览器中运行，那就是 JavaScript”似乎是一个不错的经验法则。但如果它仅在浏览器中运行，你能说”它就是 JavaScript”吗？反之，如果代码无法在浏览器中运行，但在其他地方可以运行，又该如何界定？

服务器端 JavaScript

const fs = require('fs')；
const content = fs.readFileSync('./data.txt'， 'utf8')；

这段代码可以在 Node 环境(或兼容 Node 的环境，如 Deno)中运行，但无法在浏览器中运行。它算是”纯 JavaScript”吗？元素周期表

环境变量

你可能在 .js 文件中见过这样的代码：

const apiUrl = process.env.API_URL；

但这是遵循 Node 规范，这意味着该 .js 文件在浏览器中可能无法正常运行，但在服务器上可以。如果代码能执行但仅在了解运行时规范的情况下才能正常工作，它算是”纯 JavaScript”吗？

JSX

那么这个文件 MyComponent.js 呢？

function MyComponent() {
  const handleClick = () => {/* do stuff */}
  return (
    <Button onClick={handleClick}>Click me</Button>
  )
}

它无法在浏览器中运行。它需要一个编译步骤将其转换为 React.createElement(...)(或可能是其他内容)，这样才能在浏览器中运行。或者等等，它也可以在服务器上运行。因此它可以在服务器或浏览器中运行，但现在需要编译步骤。它算是”纯 JavaScript”吗？

编译指令

这个小片段呢？

/** @jsx h */
import { h } from "preact";
const HelloWorld = () => <div>Hello</div>;

这些是影响 JavaScript 代码解释和编译的魔术注释(Tom MacWright 对此有一篇精彩的文章)。如果代码包含指导其编译和后续执行的魔术注释，它还是”纯 JavaScript”吗？

TypeScript

那么：

const name： string = "Hello world"；

你随处可见它，它似乎几乎与 JavaScript 同义，你会认为它是”纯 JavaScript”吗？

导入

你很可能遇到过一个 .js 文件，顶部看起来像这样。

import icon from './icon.svg';
import data from './data.json';
import styles from './styles.css';
import foo from '~/foo.js';
import foo from 'bar:foo';

但其中很多语法是非标准的(我之前曾详细讨论过这个话题)，并且需要某种编译——这算是”纯粹的 JavaScript”吗？

原生

这是一个 .js 文件：

var foo = 'bar'；

我可以在这里运行它(在浏览器中)。我可以在那里运行它(在服务器上)。我可以在任何地方运行它。它不需要编译器、魔法语法、打包工具、转译器或运行时特定的语法。它在任何地方都会以相同的方式运行。这似乎确实是”纯 JavaScript”。

始终如此，上下文至关重要

你每天看到的很多 JavaScript 都是非标准的。尽管它可能非常普遍——例如看到 process.env.*——但很多 JS 代码需要你”了解内情”才能理解它实际上是如何工作的，因为它没有遵循 ECMAScript 标准的任何部分。要理解一个 .js 文件，你需要掌握以下几个关键上下文信息：

该代码将在哪个运行时环境中执行？浏览器？服务器端环境如 Node、Deno 或 Bun？还是其他环境如 Cloudflare Workers？
执行该代码前需要哪些工具进行编译？(如 vite、esbuild、webpack、rollup、TypeScript 等)
代码中隐含了哪些框架？例如，是否存在非标准的全局变量如 Deno.*，或特殊关键字导出如 export function getServerSideProps()｛...｝？

当有人说”这只是 JavaScript”时，更明确的说法应该是”这只是适用于…的 JavaScript”，例如：

这是适用于浏览器的 JavaScript
它只是用于 Node 的 JavaScript
它只是用于 Next.js 的 JavaScript

那么，你如何称呼可以在上述任何上下文中运行的 JavaScript？我想，你可能会称它为”只是 JavaScript”。

阅读余下内容

javascript| 2025-06-03