拆分和连接功能或替换功能

Question

我很好奇 JavaScript 中哪个函数更快，但我找不到解决这个问题的方法。让我们取一个简单的字符串并将所有空格替换为下划线。

let string = 'Hello World';
let newString = string.split(' ').join('_');
//newString: Hello_World

解决这个问题的另一种方法是替换功能：

let string = 'Hello World';
let newString = string.replace(/ /g,"_");
//newString: Hello_World

两种方式（在我看来）都可以阅读。我想知道此时（2018 年 5 月）哪种方式更快。我找到了一些答案，但它们已经过时了，我想知道它们是否提高了新浏览器的性能。

Answer 1

我运行了一个 JSPerf 来测试哪个更快，正如我所想，replace 函数快了大约 40-50%（我在 Chrome 66 上测试过）：

https://jsperf.com/replace-vs-split-join-seblor

此外，您还获得了内存增益，因为split 创建了一个数组。

---

2021 年编辑：

由于仍在阅读此答案，因此这里有一个 sn-p，因此您可以在浏览器中测试性能：

function runBenchmark() {
  console.log('Starting...');
  const string = 'Hello World';
  const replaceRegex = / /g
  new Benchmark.Suite()
    .add('split & join', () => {
      let newString = string.split(' ').join('_');
    })
    .add('replace regex', () => {
      let newString = string.replace(replaceRegex, "_");
    })
    .on('cycle', (event) => {
      console.log(String(event.target));
    })
    .run({ async: true });
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/benchmark/2.1.4/benchmark.min.js"></script>
<button onclick="runBenchmark()">Run Benchmark</button>

在 chrome 94 上，正则表达式替换的速度似乎是拆分和加入的两倍。

Answer 2

根据我的个人经验：这根本不重要，除非您正在编写绝对高性能的 JavaScript（例如 10k ops/frame）。由于编译器优化，编写有意义的 perftest 也非常困难，这非常复杂，很难理解实际测量的内容。

在另一篇文章中，有一个提示，循环将是最快的，但我怀疑它在实践中是否真的相关。

Which is more efficient .replace() or .split().map().join()

查看@Seblor 的 jsperf 测试结果，您会发现，每秒可能有数十万次调用。因此，性能并不是真正的问题。

拆分加入：1,381,976 ±6.79% 慢 25%

替换 1,856,450 ±7.22% 最快的

所以：选择你更喜欢的。