如何从 JavaScript 中的字符串中删除尾部斜杠

作者

目录

How to Remove a Trailing Slash from a String in JavaScript

  1. 从 JavaScript 中的字符串中删除尾部斜杠
  2. 使用从字符串中删除尾部斜杠String.endsWith()

从 JavaScript 中的字符串中删除尾部斜杠

使用该String.replace()方法从字符串中删除尾部斜杠，例如str.replace(/\/+$/, '').

该replace()方法将通过用空字符串替换它来从字符串中删除尾部斜杠。

索引.js
function removeTrailingSlash(str) {
  return str.replace(/\/+$/, '');
}

// 👇️ "bobbyhadz.com"
console.log(removeTrailingSlash('bobbyhadz.com/'));

// 👇️ "bobbyhadz.com"
console.log(removeTrailingSlash('bobbyhadz.com///'));

// 👇️ "bobbyhadz.com"
console.log(removeTrailingSlash('bobbyhadz.com'));
如果您希望避免使用正则表达式，请向下滚动到下一个副标题。

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

该方法采用以下参数：

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

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

索引.js
function removeTrailingSlash(str) {
  return str.replace(/\/+$/, '');
}

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

我们必须
用反斜杠转义正斜杠，
因为正斜杠是正则表达式中的特殊字符。

加号+与前面的项目（正斜杠）匹配 1 次或多次。

美元$符号匹配输入的末尾。

就其整体而言，正则表达式匹配字符串末尾的一个或多个尾部斜杠。

如果您的字符串不以正斜杠结尾，该replace()方法将按原样返回字符串，而不删除任何内容。

索引.js
function removeTrailingSlash(str) {
  return str.replace(/\/+$/, '');
}

// 👇️ "bobbyhadz.com"
console.log(removeTrailingSlash('bobbyhadz.com/'));

// 👇️ "bobbyhadz.com"
console.log(removeTrailingSlash('bobbyhadz.com///'));

// 👇️ "bobbyhadz.com"
console.log(removeTrailingSlash('bobbyhadz.com'));

第三个字符串 –bobbyhadz.com不以尾部斜杠结尾，因此字符串中的正则表达式不匹配，该replace方法返回原始字符串。

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

索引.js
const str = 'bobbyhadz.com/';

const result = str.replace(/\/+$/, '');
console.log(result); // 👉️ "bobbyhadz.com"

console.log(str); // 👉️ "bobbyhadz.com/"

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

另一种方法是使用
String.endsWith方法。

从字符串中删除尾部斜杠使用String.endsWith()

这是一个三步过程：

  1. 使用endsWith()方法检查字符串是否以斜杠结尾。
  2. 如果是，请使用该slice()方法从字符串中删除最后一个字符。
  3. 如果它没有按原样返回字符串。
索引.js
function removeTrailingSlash(str) {
  return str.endsWith('/') ? str.slice(0, -1) : str;
}

// 👇️ "bobbyhadz.com"
console.log(removeTrailingSlash('bobbyhadz.com/'));
// 👇️ "bobbyhadz.com"
console.log(removeTrailingSlash('bobbyhadz.com'));

如果字符串以指定的子字符串结尾，则
String.endsWith方法返回，否则
返回。truefalse

索引.js
console.log('bobbyhadz.com/'.endsWith('/')); // 👉️ true
console.log('bobbyhadz.com'.endsWith('/')); // 👉️ false

如果字符串以斜杠结尾，我们使用
String.slice方法并返回整个字符串直到最后一个字符。

String.slice方法提取字符串的一部分并将其返回，而不修改原始字符串。

该String.slice()方法采用以下参数：

姓名 描述
起始索引 要包含在返回的子字符串中的第一个字符的索引
结束索引 要从返回的子字符串中排除的第一个字符的索引

该String.slice()方法可以通过负索引来倒数。

索引.js
const str = 'bobbyhadz.com';

console.log(str.slice(0, -1)); // 👉️ bobbyhadz.co
console.log(str.slice(0, -2)); // 👉️ bobbyhadz.c
JavaScript 索引是从零开始的，因此字符串中第一个字符的索引是0，最后一个字符的索引是。 str.length - 1

使用结束索引-1和结束索引string.length - 1是相同的。

我们指示该String.slice()方法转到但不包括字符串中的最后一个字符。

如果字符串不以斜杠结尾，我们只返回整个字符串。

索引.js
function removeTrailingSlash(str) {
  return str.endsWith('/') ? str.slice(0, -1) : str;
}

// 👇️ "bobbyhadz.com"
console.log(removeTrailingSlash('bobbyhadz.com/'));
// 👇️ "bobbyhadz.com"
console.log(removeTrailingSlash('bobbyhadz.com'));

三元运算符与语句非常相似if/else。

如果问号左边的表达式为真，则运算符返回冒号左边的值，否则返回冒号右边的值。

请注意，此方法不处理字符串以多个斜杠结尾的情况。我们只在使用该方法时删除最后一个斜线slice。

如果您需要从字符串中删除一个或多个尾部斜杠，请使用
String.replace()前一个副标题中的方法。

额外资源

您可以通过查看以下教程来了解有关相关主题的更多信息：