写过 JS 的人都踩过这个坑——迭代器每次想拼成字符串，都要先吐成数组。今天这件事被 Chrome 154 一个方法彻底原生化了

写 JS 的人都熟悉 Array.prototype.join()，一行把数组拼成字符串，舒服。但如果你用的是迭代器，而不是数组，这条路就走不通了——迭代器是惰性的，逐个产出值，没有 join 方法。想把迭代器的值拼成字符串？标准做法是先 […iterator] 把它整个吐成数组，然后再 join。

这就麻烦了：吐成数组就意味着把整个迭代器消费掉，失去了惰性求值的意义；如果是无限生成器，根本就不能这么干；大数据集更是会瞬间撑爆内存。

Chrome 154 和 Edge 153 今天把这件事原生化了——Iterator.prototype.join()，直接对迭代器调用 join，不用先转数组。

基本用法很简单：

function* fibonacci() {
  let current = 1, next = 1;
  while (true) {
    yield current;
    [current, next] = [next, current + next];
  }
}

// 取前5个斐波那契数，拼成逗号分隔的字符串
fibonacci().take(5).join()
// "1,1,2,3,5"

// 自定义分隔符
fibonacci().take(5).join(" - ")
// "1 - 1 - 2 - 3 - 5"

这里用到了两个方法：take(n) 是 Iterator.prototype.take()，从 ES2025 就有了，取前 n 个元素返回新迭代器；join() 就是这次的主角，把迭代器消费完，拼成字符串。两者组合，就实现了对惰性迭代器的字符串拼接，而且只消费你需要的 n 个值，不会把整个无限生成器都跑完。

和 Array.prototype.join() 一样，separator 省略默认是逗号；undefined 和 null 会被转成空字符串而不是 “null”/”undefined”；空迭代器返回空字符串。

实际场景里，最常见的就是处理流式数据。比如你从某个 API 拿到了一个大文件的行迭代器，想按行处理，但最终需要按指定分隔符合并输出：

async function processLines(url) {
  const response = await fetch(url);
  const reader = response.body
    .pipeThrough(new TextDecoderStream())
    .lines()
    .values();

  const filtered = reader.filter(line => line.trim().length > 0);
  const result = filtered.join("n");
  return result;
}

注意这里有一个坑：Iterator.prototype.join() 是不惰性的——它必须消费完整个迭代器才能输出字符串，所以不适合无限迭代器（但 take() 可以限制消费数量）。

兼容性方面，Chrome 154+、Edge 153+、Firefox 154+、Safari 18.4+ 已稳定支持，覆盖约 88% 全球用户。Node.js 22+ 也有了。如果需要兼容旧版本，core-js 和 es-shims 都有 polyfill。

总结一下：以前迭代器想拼字符串必须先转数组，现在 Chrome 154 原地原生化了。如果你正在用迭代器处理数据流、大文件、或者需要惰性求值的场景，join() 值得加进你的工具箱。