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


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

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

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

使用 reverse() 方法

对于每个基本操作,JavaScript 都包含内置方法。同样,它也包含 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 循环来反转字符串。在本节中,我们将就地反转字符串。就地反转意味着无需使用额外的空间或新变量即可反转字符串。在上述方法中,我们创建了 char 数组,这意味着我们使用了额外的空间。

算法

用户可以按照以下算法使用 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+ 阅读量

开启您的 职业生涯

通过完成课程获得认证

开始学习
广告