如何在 JavaScript 中就地反转字符串?


在本教程中,我们将学习如何在 JavaScript 中就地反转字符串。如何反转字符串是应届毕业生面试中最常见的问题之一。这是一个简单的任务,但面试官可能会很狡猾,让你觉得这个问题很难。例如,如果面试官让你编写伪代码来就地反转字符串,而不使用额外的空间,你会怎么做?你应该提前准备好这类棘手问题的答案。

反转字符串的方法有很多。随着开发人员开发新的逻辑,他们可以构建新的算法。

在本教程中,我们将通过创建自定义函数和内置方法来了解一些最流行的反转字符串算法和方法。

使用 reverse() 方法

对于每个基本操作,JavaScript 都包含内置方法。同样地,它也包含 reverse() 方法来反转数组。在我们的例子中,我们将字符串转换为字符数组,然后反转它,再将其重新连接成字符串。

由于我们使用了 内置的 reverse 方法,因此它是一种优化的方法,因为每个库函数都是以优化时间复杂度和空间复杂度的方式创建的。

算法

用户可以按照以下算法使用 reverse() 方法反转字符串。

  • 步骤 1 − 使用扩展运算符将字符串转换为字符数组。扩展运算符是三个点 (…),用于克隆任何对象或数组。

  • 步骤 2 − 接下来,使用 reverse() 方法反转字符数组。

  • 步骤 3 − 使用 join() 方法连接反转后的字符数组,你就可以得到反转后的字符串了。

语法

用户可以按照以下语法使用算法中的方法。

let string = "TutorialsPoint";
let charArray = [ ...string ]; // convert string to char array
charArray.reverse( ); // reverse the array of character
string = charArray.join(''); // join array of character.

示例

以下示例演示了上述算法的使用。

<!DOCTYPE html>
<html>
<body>
   <h2> Reverse the string in place in JavaScript. </h2>
   <p> After reversing the "TutorialsPoint" string using reverse() method: </p>
   <div id="output"></div>
   <script>
      let output = document.getElementById("output");
      let string = "TutorialsPoint";
      let charArray = [...string];
      charArray.reverse();
      string = charArray.join('');
      output.innerHTML = string;
   </script>
</body>
</html>

在以上输出中,用户可以看到我们的字符串最终被反转了。

使用 for 循环创建自定义算法

此方法将创建一个递增的 for 循环来反转字符串。在本节中,我们将就地反转字符串。就地反转意味着不使用额外的空间或新变量来反转字符串。在以上方法中,我们创建了字符数组,这意味着我们使用了额外的空间。

算法

用户可以按照以下算法使用 for 循环反转字符串。

  • 步骤 1 − 遍历字符串,从字符串的开头到结尾。我们可以使用字符串长度找到字符串的终点。

  • 步骤 2 − 开始将字符串的每个字符附加到新字符串的前面。

  • 步骤 3 − 继续执行步骤 3 直到字符串的终点,你将得到反转后的字符串。

用户可以按照以下语法使用循环反转字符串。

示例

在以下示例中,我们使用 reverseString 变量存储反转后的字符串,并使用 for 循环使字符串反转。

<html>
<body>
   <h2> Reverse the string in place in JavaScript. </h2>
   <h4> After reversing the "welcome to TutorialsPoint" string using for loop algortim. </h4>
   <div id="output"></div>
   <script>
      let output = document.getElementById("output");
      let string = "welcome to TutorialsPoint";
      let l = string.length; // finding the length of the string
      let reverseString = '';
      for (let i = 0; i < l; i++) {
         reverseString = string[i] + reverseString;
      }
      output.innerHTML = reverseString;
   </script>
</body>
</html>

创建递归函数来反转字符串

本节将介绍递归方法来反转字符串。在本方法中,我们不会像以上方法那样使用任何额外的变量,但当我们进行递归调用时,它会存储所有函数调用和堆栈跟踪,这比单个变量占用更多的空间。

算法

按照以下算法递归地反转字符串。

  • 步骤 1 − 如果字符串为空,则返回 ‘ ’,即空字符串。

  • 步骤 2 − 如果字符串不为空,则将第一个字符附加到最后,并对从第一个字符到字符串末尾的子字符串进行递归函数调用。

  • 步骤 3 − 通过将字符串的第一个字符附加到最后,返回子字符串递归调用的返回值。

用户可以按照以下语法实现上述算法。

示例

在以下示例中,我们实现了递归方法来反转字符串。

<html>
<body>
   <h2> Reverse the string in place in JavaScript.</h2>
   <h4> After reversing the "Hello world!" string using recuersive algortim. </h4>
   <div id="output"> </div>
   <script>
      let output = document.getElementById("output");
      function reverse(string) {
         if (string === "") {
            return "";
         } else {
         return reverse(string.substr(1)) + string[0];
         }
      }
      let result = reverse("Hello world!");
      output.innerHTML = result;
   </script>
</body>
</html>

结论

在本教程中,我们学习了三种不同的反转字符串方法。第一种方法最简单,只需要两行代码,因为我们使用了内置的 reverse 方法。第二种方法是最好的,因为它占用最少的内存。第三种方法不是很好,因为它会花费更多的时间和空间。

更新于: 2022-07-26

2K+ 次查看

开启你的 职业生涯

通过完成课程获得认证

开始学习
广告