用 JavaScript 中的单个空格替换多个空格

作者

在 JavaScript 中用一个空格替换多个空格

Replace Multiple Spaces with a Single Space in JavaScript

使用该String.replace()方法将多个空格替换为单个空格，例如str.replace(/ +/g, ' ').

该String.replace()方法将返回一个新字符串，其中所有出现的多个连续空格都替换为一个空格。

索引.js
const str = 'bobby   hadz    com';

// ✅ Replace multiple spaces with a single space
const result1 = str.replace(/  +/g, ' ');
console.log(result1); // 👉️ "bobby hadz com"

// ------------------------------------------------------

// ✅ Replace multiple spaces, tabs, newlines with a single space
const result2 = str.replace(/\s+/g, ' ');
console.log(result2); // 👉️ "bobby hadz com"

String.replace
()
方法返回一个新字符串，其中一个、一些或所有正则表达式的匹配项被替换为提供的替换项。

该方法采用以下参数：

姓名 描述
图案 要在字符串中查找的模式。可以是字符串或正则表达式。
替代品 用于用提供的模式替换子字符串匹配的字符串。

我们传递给该方法的第一个参数是一个正则表达式。

字符/ /匹配正则表达式的开头和结尾。

索引.js
const str = 'bobby   hadz    com';

const result1 = str.replace(/  +/g, ' ');
console.log(result1); // 👉️ "bobby hadz com"

加号+与前面的项目（空格）匹配 1 次或多次。

使用+，我们指定我们要匹配1 个或多个出现的空格，换句话说，一个或多个连续的空格。

我们使用了g(global) 标志，因为我们想要匹配字符串中所有出现的空格，而不仅仅是第一次出现的。

我们传递给该方法的第二个参数String.replace()是每个匹配项的替换。

在我们的例子中，我们用一个空格替换多个空格。

该String.replace()方法返回一个新字符串，其中替换了模式的匹配项。该方法不会更改原始字符串。

字符串在 JavaScript 中是不可变的。

处理前导或尾随空格

您可能必须处理字符串包含前导或尾随空格的情况。

索引.js
const str = '   bobby   hadz    com  ';

const result1 = str.replace(/  +/g, ' ');
console.dir(result1); // 👉️ ' bobby hadz com '

示例中的字符串以空格开头和结尾，因此结果包含前导空格和尾随空格。

您可以使用该String.trim()方法在调用 之前删除前导和尾随空格replace()。

索引.js
const str = '   bobby   hadz    com  ';

const result1 = str.trim().replace(/  +/g, ' ');
console.dir(result1); // 👉️ 'bobby hadz com'

String.trim ()方法从字符串中删除前导和尾随空格并返回一个新字符串，而不修改原始字符串。

该trim()方法删除所有空白字符，包括空格、制表符和换行符。

用一个空格替换多个空白字符

如果需要用单个空格替换多个空格、制表符和换行符，请使用以下正则表达式。

索引.js
const str = 'bobby \n\t\n  hadz  \n\t\n  com';

const result2 = str.replace(/\s+/g, ' ');
console.log(result2); // 👉️ "bobby hadz com"

正斜杠标记/ /正则表达式的开始和结束。

该\s字符用于匹配空格、制表符和换行符。

加号+与前面的项目（空白字符和换行符 ( \n) 字符）匹配 1 次或多次。

g （全局）标志用于指定我们要匹配正则表达式的所有出现，而不仅仅是第一次出现。

我们传递给该方法的第二个参数String.replace()是替换字符串。

出于我们的目的，我们将多个空格、制表符或换行符替换为一个空格。

或者，您可以使用split()和join()方法。

使用 split() 和 join() 用单个空格替换多个空格

这是一个两步过程：

  1. 使用该split()方法将字符串拆分为一个或多个空格。
  2. 使用该join()方法连接带有空格分隔符的子字符串数组。
索引.js
const str = '   bobby   hadz    com  ';

const result = str.trim().split(/\s+/g).join(' ');
console.dir(result); // 👉️ 'bobby hadz com'

我们使用该String.trim()方法从字符串中删除前导和尾随空格。

String.split ()
方法接受一个分隔符，并在每次出现所提供的分隔符时将字符串拆分为一个数组。

该String.split()方法采用以下 2 个参数：

姓名 描述
分隔器 The pattern describing where each split should occur.
limit An integer used to specify a limit on the number of substrings to be included in the array.
index.js
const str = '   bobby   hadz    com  ';

// [ 'bobby', 'hadz', 'com' ]
console.log(str.trim().split(/\s+/g));

The last step is to join the array of strings with a space separator.

index.js
const str = '   bobby   hadz    com  ';

// 'bobby hadz com'
console.log(str.trim().split(/\s+/g).join(' '));

The Array.join() method
concatenates all of the elements in an array using a separator.

The only argument the Array.join() method takes is a separator – the string
used to separate the elements of the array.

# Additional Resources

You can learn more about the related topics by checking out the following
tutorials: