在Javascript中用下划线替换初始空格

Question

将空格替换为（例如）下划线很容易：

y = x.replace(/ /g, '_');

去掉前导空格也很容易：

y = x.replace(/^ +/, '');

但是是否有一种好的方法只用下划线替换最初的空格呢？

- Charles

---

@T.J.Crowder 这会将所有空格都替换为单个下划线。我想要将每个前导空格替换为下划线。 - Charles

可能是重复的问题：Javascript正则表达式 - 用另一个字符替换字符序列中相同数量的字符。 - Sebastian Proske

Answer 1

T.J. Crowder的答案绝对比这种方法更好，但我想添加它是因为在所有主要浏览器中支持后瞻只是时间问题。撰写本回答时，Chrome 62和XS（2018年1月17日更新）中所提供的V8引擎是JavaScript中可变长度后瞻的唯一实现，这是根据EMCA TC39的正则表达式后瞻提案。

请注意，下面的正则表达式包含一个尾随空格。如果您使用的是Chrome 62+（或者您在未来使用支持可变长度后瞻的其他浏览器），则可以在此测试正则表达式。

(?<=^ *) 

const regex = /(?<=^ *) /g
const str = '        something is here'

console.log(str.replace(regex, '_'))

- ctwheels

---

“T.J. Crowder的答案绝对比这种方法好…” 我不同意 :-) 非常酷。 而且由于正向先行断言已经是第四阶段，这意味着它们至少在两个实现中（可能是V8和SpiderMonkey），并且它们将出现在ES2018快照规范中。 - T.J. Crowder

@T.J.Crowder 这很酷，但还不能在所有浏览器上运行。如果编写生产代码，我仍然会使用您的方法 :) - ctwheels

Answer 2

我希望用下划线替换每个前导空格。

要在当前规范中只使用一个replace调用完成此操作，您需要使用replace函数调用版本来创建与空格匹配序列一样长的下划线字符串：

y = x.replace(/^ +/, function(m) {
    return "_".repeat(m.length);
});

或者使用ES2015+的箭头函数：

y = x.replace(/^ +/, m => "_".repeat(m.length));

实时示例：

const x = "    four spaces";
const y = x.replace(/^ +/, m => "_".repeat(m.length));
console.log(y);

String.prototype.repeat 是在 ES2015 中新增的。如果您需要支持已过时的 JavaScript 引擎，MDN 页面 提供了一个可以使用的 polyfill。

---

* 但是看看ctwheels的答案使用了ES2018的一个特性：向后查找。非常聪明！

- T.J. Crowder

---

很好，我还没有真正使用过“胖箭头”。 - Charles

Answer 3

将两个正则表达式组合在一起并没有什么问题：

var x = '     hello world';
var y = x.replace(/^ +/, u => u.replace(/ /g,  "_"));
console.log(y); // Outputs: ____hello world

上述的长版将是：

...

var y = x.replace(/^ +/, function (u) { return u.replace(/ /g, "_"));

基本上，外部的正则表达式/替换获取初始空格，内部的正则表达式/替换仅将这些空格替换为下划线。

- Stephen Quan