JavaScript regex – 如何替换特殊字符

既不是字母也不是数字的字符被称为特殊字符。特殊字符基本上是所有不可读的字符，包括标点符号、重音符号和符号标记。从字符串中删除任何特殊字符，使其更易于阅读和理解。在我们开始本文之前，让我们快速了解JavaScript中的正则表达式。

JavaScript中的正则表达式

正则表达式是可用于匹配字符串中字符组合的模式。正则表达式是JavaScript中的对象。这些模式可以与RegExp的exec()和test()方法以及String的match()、matchAll()、replace()、replaceAll()、search()和split()方法一起使用。

语法

以下是正则表达式的语法 –

/pattern/modifier(s);

让我们深入本文以更好地理解如何替换特殊字符。接下来我们将使用replace()方法。

使用replace()方法

JavaScript的内置方法string.replace()可以用于将提供的字符串的一部分替换为另一个字符串或正则表达式。原始字符串不会被改变。

语法

以下是replace()的语法

string.replace(searchValue, newValue)

为了更多地了解替换特殊字符，请看下面的例子。

示例

在以下示例中，我们正在运行脚本以使用replace()替换所有特殊字符。

<!DOCTYPE html>
<html>
   <body style="background-color:#ABEBC6">
      <script>
         var statement = "We#@lcome!! To! The@ Tutorials$Point%";
         var result = statement.replace(/[^a-zA-Z ]/g, "");
      document.write(result);
      </script>
   </body>
</html>

当脚本被执行时，它将生成由在脚本中使用的特殊字符替换的文本组成的输出。

示例

考虑以下示例，我们正在运行脚本以使用replace()替换特殊字符。

<!DOCTYPE html>
<html>
   <body>
      <p id="tutorial"></p>
      <button onclick="replacespecial()">Click To Change</button>
      <p id="tutorial1"></p>
      <script>
         var element_up = document.getElementById("tutorial");
         var element_down = document.getElementById("tutorial1");
         var statement = "Th@e Bes^t E-w#ay Le*arn(ing";
         element_up.innerHTML = statement;
         function replacespecial() {
            element_down.innerHTML =
            statement.replace(/[&\/\#, +()~%.'":@^*?<>{}]/g, '!');
         }
      </script>
   </body>
</html>

在运行上述脚本时，输出将弹出，显示原始语句以及一个单击按钮。当用户单击该按钮时，事件将被触发，并将所有特殊字符替换为在网页上显示的“!”。

示例

执行下面的脚本并观察使用 replace() 方法替换所有特殊字符的情况。

<!DOCTYPE html>
<html>
   <body>
      <script>
         let statement = "T!P, Wher$%e Y@ou F*ind L@ot O!f Courses"
         function replacespecial(_value){
            var lowerCase = _value.toLowerCase();
            var upperCase = _value.toUpperCase();
            var replacement = "";
            for(var i=0; i<lowerCase.length; ++i) {
               if(lowerCase[i] != upperCase[i] || lowerCase[i].trim() === '' || lowerCase[i].trim() === "." ||
               lowerCase[i].trim() === ",")
               replacement += _value[i];
            }
            return replacement;
         }
         let result = replacespecial(statement)
         document.write(result)
      </script>
   </body>
</html>