JavaScript之我在正则表达式里踩的坑

柔情只为你懂 2023-02-24 08:56 47阅读 0赞

在学习正则表达式的时候，突然翻车，代码如下：

var str = "Visit Runoob!"; 
    var str1= "/noo/i";
    document.write(str.search(str1));

以为就是走个流程，然而懵了：输出结果是-1.  
半天也没找出错在哪里。  
然后误打误撞下整出了下面的代码：

var str = "Visit Runoob!"; 
    var str1= /noo/i;
    document.write(str.search(str1));

咦，我又懵了，怎么居然就对了呢  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NTY2MzkwNQ_size_16_color_FFFFFF_t_70]  
搞了很久，才找到原因：str1是个对象，不是字符串，所以不能用引号引起来。

不对，那为什么菜鸟教程上的代码能用引号，如下：

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NTY2MzkwNQ_size_16_color_FFFFFF_t_70 1]  
不是说search() 、replace() 可以使用字符串吗？怎么有时就不行了呢

![在这里插入图片描述][20200709100940268.png]仔细对比了代码，发现第一个之所以不行，是因为声明变量并赋值的时候没有出现search，而后面那个是在出现了search的情况下赋值的。可能就是这个原因引起的吧

var str = "Visit Runoob!";               var str = "Visit Runoob!"; 
    var str1= "/noo/i";                      var n = str.search("Runoob");
    document.write(str.search(str1));        document.write(n);

作为一个小白，也不知道这么理解对不对，如有不对之处，还请大佬们指正。

**附：**  
定义：  
`正则表达式是由一个字符序列形成的搜索模式。在文本中搜索数据时，可以用搜索模式来描述要查询的内容。`

`正则表达式可以是一个简单的字符，或一个更复杂的模式。可用于所有文本搜索和文本替换的操作。`

语法  
`/正则表达式主体/修饰符(可选)`  
其中修饰符

i	执行对大小写不敏感的匹配。
    g	执行全局匹配（查找所有匹配而非在找到第一个匹配后停止）。
    m	执行多行匹配。

表达式

[abc]	查找方括号之间的任何字符。
    [0-9]	查找任何从 0 至 9 的数字。
    (x|y)	查找任何以 | 分隔的选项。

元字符

\d	查找数字。
    \s	查找空白字符。
    \b	匹配单词边界。
    \uxxxx	查找以十六进制数 xxxx 规定的 Unicode 字符。

量词

n+	匹配任何包含至少一个 n 的字符串。
    n*	匹配任何包含零个或多个 n 的字符串。
    n?	匹配任何包含零个或一个 n 的字符串。

test()

`test() 方法用于检测一个字符串是否匹配某个模式，如果字符串中含有匹配的文本，则返回 true，否则返回 false。`

exec()  
`exec() 方法用于检索字符串中的正则表达式的匹配。该函数返回一个数组，其中存放匹配的结果。如果未找到匹配，则返回值为 null。`

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NTY2MzkwNQ_size_16_color_FFFFFF_t_70]: /images/20230209/533fedb5b4cc4b9ab5a0405ccd8190af.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NTY2MzkwNQ_size_16_color_FFFFFF_t_70 1]: https://img-blog.csdnimg.cn/20200709095253827.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NTY2MzkwNQ==,size_16,color_FFFFFF,t_70
[20200709100940268.png]: https://img-blog.csdnimg.cn/20200709100940268.png