替换 JavaScript 中特定索引处的字符

目录

Replace a Character at a specific Index in JavaScript

  1. 在 JavaScript 中替换字符串中特定索引处的字符
  2. 替换字符串中特定索引处的多个字符
  3. 仅替换字符串中特定索引处的单个字符
  4. 使用 split() 替换字符串中特定索引处的字符

在 JavaScript 中替换字符串中特定索引处的字符

要替换字符串中特定索引处的字符:

  1. 使用String.slice()方法获取字符之前的部分。
  2. 使用String.slice()方法获取字符后的部分。
  3. 使用加法 (+) 运算符添加两个部分之间的替换。
索引.js
function replaceCharacter(string, index, replacement) { return ( string.slice(0, index) + replacement + str.slice(index + replacement.length) ); } const str = 'bobby'; const result1 = replaceCharacter(str, 2, '_'); console.log(result1); // 👉️ bo_by const result2 = replaceCharacter(str, 2, '!@'); console.log(result2); // 👉️ bo!@y

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

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

姓名 描述
起始索引 要包含在返回的子字符串中的第一个字符的索引
结束索引 要从返回的子字符串中排除的第一个字符的索引
slice()方法不会更改原始字符串。该方法返回一个包含原始字符串的一部分的新字符串。
  1. 对该方法的第一次调用String.slice()在要替换的字符之前返回了一部分字符串。

  2. 对该方法的第二次调用返回了要替换的字符之后的字符串部分。

索引.js
const str = 'bobby'; const index = 2; const replacement = '_'; // 👇️ bo console.log(str.slice(0, index)); // 👇️ by console.log(str.slice(index + replacement.length));

在示例中,我们将 index 处的字符替换2b下划线_

请注意,我们在第二次调用该方法时将替换字符串的长度添加到参数中 index String.slice()

替换字符串中特定索引处的多个字符

当您需要替换字符串中的多个字符时,这很有用。

索引.js
function replaceCharacter(string, index, replacement) { return ( string.slice(0, index) + replacement + str.slice(index + replacement.length) ); } const str = 'bobby'; const index = 2; const replacement = '!@'; // 👇️ bo!@y console.log(replaceCharacter(str, index, replacement));

index起始索引是包含在内的,所以我们必须在要替换的字符的 上至少加 1 。

仅替换字符串中特定索引处的单个字符

如果只需要替换字符串中的单个字符,则不必使用替换字符串的长度,直接添加1到索引即可。

索引.js
function replaceCharacter(string, index, replacement) { return string.slice(0, index) + replacement + str.slice(index + 1); } const str = 'bobby'; const index = 2; const replacement = '_'; // 👇️ bo_by console.log(replaceCharacter(str, index, replacement));

如果您需要从特定索引开始用多个字符替换单个字符,此方法也适用。

索引.js
function replaceCharacter(string, index, replacement) { return string.slice(0, index) + replacement + str.slice(index + 1); } const str = 'bobby'; const index = 2; const replacement = '___'; // 👇️ bo___by console.log(replaceCharacter(str, index, replacement));

我们用多个字符替换了索引处字符串中的字符2

# 获取子串在字符串中的索引

如果您需要获取字符串中子字符串的索引,请使用该
String.indexOf()方法。

索引.js
const str = 'bobby'; console.log(str.indexOf('o')); // 👉️ 1 console.log(str.indexOf('bb')); // 👉️ 2

String.indexOf方法返回字符串中子字符串第一次出现的索引。

如果字符串中不包含子字符串,则该方法返回-1

# 使用替换字符串的长度来确定起始索引

如果需要用多个字符替换字符串中的多个字符,使用替换字符串的长度来确定第二个切片的第一个字符。

索引.js
function replaceCharacter(string, index, replacement) { return ( string.substring(0, index) + replacement + str.substring(index + replacement.length) ); } const str = 'bobby'; const index = 2; const replacement = '%^@'; // 👇️ bo%^@ console.log(replaceCharacter(str, index, replacement));

String.substring()通过将要替换的字符的索引添加到替换字符串的长度来使用该方法的第二次调用的起始索引。

这意味着我们从原始字符串中排除的字符与我们在替换字符串中提供的字符一样多。

或者,您可以使用String.split()Array.join()方法。

# 使用 split() 替换字符串中特定索引处的字符

这是一个三步过程:

  1. 使用String.split()方法将字符串拆分为字符数组。
  2. 用替换字符替换给定索引处的字符。
  3. 使用Array.join()方法加入没有分隔符的数组。
索引.js
function replaceCharacter(string, index, replacement) { const arr = string.split(''); arr[index] = replacement; return arr.join(''); } // 👇️ _obby console.log(replaceCharacter('bobby', 0, '_')); // 👇️ b_bby console.log(replaceCharacter('bobby', 1, '_')); // 👇️ b!@bby console.log(replaceCharacter('bobby', 1, '!@'));

我们首先使用String.split()方法将字符串拆分成一个数组。

索引.js
const str = 'bobby'; const arr = str.split(''); console.log(arr); // 👉️ [ 'b', 'o', 'b', 'b', 'y' ]

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

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

姓名 描述
分隔器 描述每个拆分应该发生的位置的模式。
限制 一个整数,用于指定要包含在数组中的子字符串数的限制。

下一步是使用括号表示法替换指定索引处的字符。

索引.js
const str = 'bobby'; const arr = str.split(''); console.log(arr); // 👉️ [ 'b', 'o', 'b', 'b', 'y' ] arr[0] = '_'; console.log(arr); // 👉️ [ '_', 'o', 'b', 'b', 'y' ]

最后一步是使用该Array.join()方法将数组的元素连接成一个没有分隔符的字符串。

索引.js
const str = 'bobby'; const arr = str.split(''); console.log(arr); // 👉️ [ 'b', 'o', 'b', 'b', 'y' ] arr[0] = '_'; console.log(arr); // 👉️ [ '_', 'o', 'b', 'b', 'y' ] const result = arr.join(''); console.log(result); // 👉️ _obby

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.

If the separator argument is set to an empty string, the array elements are
joined without any characters in between them.

This approach is suitable when you need to replace a single character in a
string at a specific index with one or more characters.

# Additional Resources

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