2026 年的 JavaScript 已经不是你认识的 JavaScript 了

[mqyqingfeng]

2026 年的 JavaScript 已经不是你认识的 JavaScript 了

你好，我是冴羽。

如果有人问你 JS，大部分人可能还停留在 async/await、Promise、ES6 那个年代。

但 JavaScript 一年一个版本，语言早就不是原来的样子了。

还有框架、运行时、构建工具……整个生态都在快速演进。

本篇带你看看 2026 年的 JavaScript 和生态到底是什么样的。

1. 语言新特性

这里重点说几个真正能改变你写代码方式的新特性。

1.1 Iterator Helpers：链式操作不再创建中间数组

❌ 旧方式：每一步都创建新数组

const result = array
.map(x => x * 2)
.filter(x => x > 10)
.slice(0, 3);

✅ 新方式：惰性求值，算到第 3 个就停

const result = Iterator.from(array)
.map(x => x * 2)
.filter(x => x > 10)
.take(3)
.toArray();

使用迭代器助手，大数据量下内存占用大幅降低，而且不只数组能用，Set、Map、生成器都可以。

2. Set 家族新方法：集合运算

这组方法解决了一个很实际的问题，那就是两个集合之间该怎么比较：

const 你会的 = new Set(["JS", "Python", "CSS", "SQL"]);
const 岗位要求 = new Set(["JS", "TypeScript", "Python"]);

// 共同技能
你会的.intersection(岗位要求); // Set {"JS", "Python"}

// 技能差距
岗位要求.difference(你会); // Set {"TypeScript"}

// 你会但岗位不需要的
你会的.difference(岗位要求); // Set {"CSS", "SQL"}

// 两者并集
你会的.union(岗位要求); // Set {"JS", "Python", "CSS", "SQL", "TypeScript"}

// 有没有一种"知己知彼"的感觉？

以前要写一堆循环才能算出来的东西，现在一行代码搞定。

3. RegExp.escape()：正则转义

假设你正在构建一个搜索功能，用户输入搜索词，你想用正则表达式来实现这个功能。

这可能存在一个风险，那就是用户输入的一些字符，比如 $ 在正则表达式中属于特殊字符，这就会导致搜索出错。

通常你需要先做转义处理，经过 15 年了，JS 终于提供了原生的方法：

const query = "$5.00 (off!)";

// ❌ 旧方式：各种特殊字符要逐个转义
const badRe = new RegExp(query, "g"); // 崩了

// ✅ ES2025：一行搞定
const goodRe = new RegExp(RegExp.escape(query), "g");

4. Promise.try()：同步异常和异步拒绝，一个 catch 搞定

一个函数可能抛同步异常，也可能返回 Promise 拒绝态，以前要写两个错误处理分支：

// ❌ 旧方式：两个错误路径
let p;
try {
  p = loadUser(id); // 同步 throw 在这里捕获
} catch (e) {
  handleError(e);
}
p?.catch((e) => handleError(e)); // 异步 reject 在这里捕获

现在一个 catch 搞定：

// ✅ ES2025：一个入口，一个 catch
Promise.try(() => loadUser(id))
  .then((user) => render(user))
  .catch((err) => showError(err)); // 同步异常和异步拒绝都在这

代码是不是清爽了很多？

5. Import Attributes：直接 import JSON 和 CSS

// 直接导入 JSON，不用再 fetch + parse 了
import data from "./file.json" with { type: "json" };

// 直接导入 CSS，配合 Web Components 使用
import sheet from "./styles.css" with { type: "css" };

不过这里要注意：如果 import JSON 失败了，会让整个模块一起崩溃。建议用动态 import 加 try-catch 来兜底：

try {
  const { default: data } = await import(url, {
    with: { type: "json" },
  });
} catch (error) {
  // 降级逻辑
}

6. Temporal API：以后时间处理就用这个了

以后不再需要 Moment.js、Day.js 了：

// 获取特定时区的当前时间
const now = Temporal.Now.zonedDateTimeISO("America/New_York");
console.log(now.toLocaleString());

最经典的血案莫过于计算 1 月 31 日再加一个月了：

const date = new Date(2026, 0, 31);
date.setMonth(date.getMonth() + 1);
console.log(date.toDateString()); // "Sun Mar 03 2026" ❌ 跳到 3 月了

用 Temporal 就正确了：

const jan31 = Temporal.PlainDate.from("2026-01-31");
const feb = jan31.add({ months: 1 });
console.log(feb.toString()); // "2026-02-28" ✅

Safari 目前是最后一个还没支持的浏览器，但已经在 Technical Preview 阶段了，正式支持不远了。

7. Explicit Resource Management：不用手动写 cleanup 了

Node.js 里的文件句柄、数据库连接，用完还要手动关，这一直是个老大难问题。

ES2026 引入了 using 关键字，作用域结束自动调用清理逻辑：

async function saveData() {
  await using file = new FileHandle("output.txt");
  await file.write("hello world");
  // file 自动 flush + close，就算中间抛出异常也会执行
}

多个资源要用 DisposableStack:

async function runJob() {
  await using stack = new AsyncDisposableStack();

  const db = stack.use(await openDatabase());
  const file = stack.use(new FileHandle("output.txt"));
  const tmpDir = stack.defer(async () => removeTempDir("/tmp/job"));

  // ... 业务逻辑

  // 退出时自动按逆序清理，三个资源全关掉
}

这就是 RAII 模式在 JavaScript 里的落地。

8. 一些值得关注的小改进

• Array.fromAsync：异步迭代器直接转数组，分页场景很实用

• Error.isError()：跨 Realm（如 Web Worker、iframe）判断是否是真正的 Error 对象

• Math.sumPrecise：告别 0.1 + 0.2 = 0.30000000000000004 的尴尬

• toBase64() / toHex()：字节数组直接编码，不用再绕 TextEncoder

2. 框架生态：React、Vue、Svelte 各有新动作

2.1. React 生态系统

React 19 在 2024 年底发布，带来了 3 个核心概念：

• RSC（React Server Components）：部分组件在服务端渲染，减少客户端 JS 体积

• Server Actions：在服务端运行的函数，前后端调用更自然

• React Compiler：自动帮你做 useMemo、useCallback 这类性能优化

但也要提醒：这些技术去年经历了两次严重的安全漏洞事件，如果你在用 RSC，务必关注官方安全公告。

2.2. Vue 生态系统

Vue 3.5 稳定运行，3.6 已经在 Alpha 阶段，最大的看点是 Vapor Mode，作为一种全新的编译策略，据说性能可以和 Solid、Svelte 5 比肩。

另外，Vite 的亲爸爸 VoidZero 收购了 NuxtLabs，Nuxt 4.0 也已经发布。

Vue 生态正在往更统一、更完善的方向走。

2.3. Svelte 生态系统

Svelte 5 带来了全新的 Runes API，实现了更细粒度的响应式，实际效果就是更高效、更快。

有意思的是，Svelte/SvelteKit 也是 Vercel 旗下的产品。

3. JavaScript 运行时：Node 继续领跑，Bun 有了大靠山

3.1. Node.js：终于能直接跑 TypeScript 了

从 Node 22.18.0 开始，不用再加任何实验性 flag：

node my-script.ts

直接跑 TypeScript 文件。注意它只是剥离类型，不做类型检查——所以生产环境还是要单独跑 tsc。

Node 这几年的方向很清晰：减少依赖、提升安全性、靠拢浏览器 API。原生测试运行器、内置 SQLite、权限模型……这些功能让它越来越像一个“开箱即用的平台”。

3.2. Bun：被 Anthropic 收购了

Bun 1.3 带来了更顺滑的 DX 体验——直接对着 HTML 文件跑，就能得到一个完整的开发服务器：

bun './**/*.html'

最重磅的消息是：Bun 被 Anthropic（Claude 的公司）收购了。有了一个资金充裕的稳定靠山，这对 Bun 的长期发展是好事。

速度依然是 Bun 的核心竞争力，只是稳定性方面偶尔会有一些问题。

3.3. Deno 2.0：最安全的选择

Deno 最大的优势是安全——默认情况下没有文件系统访问、网络连接、环境变量读取权限，必须显式授权。

// Deno 默认安全：
// 不写 --allow-read，就读不了文件
// 不写 --allow-net，就发不了网络请求

如果你要运行不受信任的代码，或者做边缘部署，Deno 是最让人放心的选择。

4. 构建工具：Vite 统治一切，Webpack 在努力追赶

4.1. Vite：v8 了，还出了个 Vite+

Vite 8 是近期最大的版本升级，不再依赖第三方打包工具 Rollup，而是用自己开发的 Rolldown。这一改变让整个工具链更统一、可预测。

Vite 还在往“全家桶”方向走，推出了 Vite+ 概念：一个工具链覆盖开发服务器、格式化、lint、测试、类型检查、打包。同时还在做 Void 平台——一个基于 Cloudflare 的部署平台，数据库、KV、AI 推理、认证、队列……全都内置了。

现在的格局是：几乎所有主流框架都在用 Vite——Astro、SolidStart、SvelteKit、Nuxt、Vue。

唯一的例外是 Next.js，它用 webpack，正在迁移到 Turbopack。

4.2. Turbopack: Next.js v16 的默认打包器

Next.js v16 把 Turbopack 设为默认打包器了。Turbopack 是 Vercel 用 Rust 写的，据说比 webpack 快 5-10 倍。不过实际迁移过程中，确实有一些兼容性问题需要处理。

4.3. webpack：2026 年有改进计划

webpack 虽然被很多人吐槽“太复杂”，但它依然是大量项目的基础。官方已经发布了 2026 年改进计划，目标就是简化 loader 配置、降低使用门槛。

5. TypeScript：v6 打基础，v7 是大招

TypeScript v6 刚刚发布，v7 预计 2026 年中期发布，v7 才是真正的大版本。

v6 主要做的是铺路工作：为 v7 换用 Go 语言重写的编译器做准备。

有几个关键变化：

• strict: true 现在是默认配置

• types 默认值变成空数组，不再自动拉取 node_modules/ @types

• target 默认值浮动到当年的 ES 规范（现在是 es2025）

最后一条影响很大：不再自动拉 @types，包体积和类型检查速度能提升 20-50%，但很多老项目会因此报错，值得提前关注。

另外一个大趋势：TypeScript 已经登顶 GitHub 第一大语言，年同比增长 66%，而且 92% 的开发者在用 AI 写代码——AI 对 TypeScript 的掌握度是最高的。

6. 测试工具：Vitest + Playwright 组合越来越主流

Vitest 基于 Vite 的测试框架，正在快速取代 Jest——它兼容 Jest 的写法，迁移成本低，性能却好很多，而且支持浏览器模式，可以跑真实的浏览器环境。

Playwright 在端到端测试领域的优势也越来越明显，比起 Puppeteer 和 Cypress，它的稳定性和跨浏览器支持都好出一个档次。

最后

写这篇文章的时候，我最大的感受是：

JavaScript 生态正在经历一个“收敛”的阶段。

以前要装几十个包才能干的事，现在语言本身、运行时、框架都在往“内置”方向走。TypeScript 直接跑、内置 SQLite、内置测试运行器……

这当然是一种好的收敛——不是说包不重要，而是那些基础能力，越来越不需要自己搭了。

作为前端工程师，我们的精力应该放在理解这些工具的能力边界上，然后专注真正重要的事：解决用户问题。

我是冴羽，10 年笔耕不辍，专注前端领域，更新了 10+ 系列、300+ 篇原创技术文章，翻译过 Svelte、Solid.js、TypeScript 文档，著有小册《Next.js 开发指南》、《Svelte 开发指南》、《Astro 实战指南》。

欢迎围观我的“网页版朋友圈“，关注我的公众号：冴羽（或搜索 yayujs），每天分享前端知识、AI 干货。