当前位置: 首页 > 我要学前端 > 三天学会用JS正则 > 第一天:为什么要用正则表达式

第一天:为什么要用正则表达式

支持左(←)、右(→)方向键,切换到下一章。

这一篇其实是不是废话的废话。前端为什么要学正则?其实可以不学,就像我一样,找个高人有需求了就让人写一下。但是总不能每次麻烦别人,痛定思痛,自己学一下。高人每次写正则之前都会这样问:你描述一下你的需求,所以就有了这第一篇。

在前端中应用最多的场景就是表单验证,为了减轻一部分负担,前端也需要对数据进行一些基本的验证,如邮箱格式、电话格式等;还有就是写一个简单的编辑器,对内容进行过滤;还有批量替换等。最大的好处就是,看起来好像很牛掰的样子。

首先要明白的就是正则处理的对象是字符串,如果是其他格式的对象,都要先转成字符串先。
通过下面的例子先搞一下JS怎么用正则。

1.RegExp()是一种构造函数,用于创建RegExp对象。RegExp()的参数个数为一个或两个。第一个参数是正则表达式,第二个是可选参数,是标志(flag)参数【例如:i表示忽略大小写,g表示全局匹配,m表示执行多行匹配】。在通过用户输入等方式产生正则表达式时,要使用构造函数。使用构造函数在整个程序运行过程中都可以改变其值,该函数是在运行时处理的。

2.JS测试正则表达式有两个方法:
test()方法用于测试在被查找的字符串中是否包含正则表达式表示的模式,其返回值为布尔值true或false。匹配成功返回true,反之就是false。

var str = "无标题文档测试正则文档.";
var regex = new RegExp("文档");
var result = regex.test(str);
alert(result);

exec()方法在指定字符串运行特定模式的匹配搜索。如果匹配失败,返回null,否则返回包含同正则表达式匹配的字符串的数组。

var str = "My lovely gloves are worn for wear, Love.";
var regex = new RegExp("love", "i");
var array = regex.exec(str);
alert(array);

顺便说一下“var regex = /文档/g;”与“var regex = new RegExp("文档","g");”这2中写法是一样的。

3.使用字符串的正则表达式方法:
match()方法和exec()方法类似,都是用于在字符串中检索字符串模式并返回一个数组,这个数组的元素分别表示匹配的模式。如果未匹配则返回null。如果设置了全局选项g,那么match()方法将在字符串中对所有匹配的字串进行全局匹配。

var str = "I love the smell of clover.";
var regex = /love/g;
var array = str.match(regex);
alert(array);

search()方法用于字符串中模式的检索,他返回与当前模式匹配的字符串的起始索引位置。索引值从0开始。如果没有找到匹配的字串则返回-1。如果是简单的检索,可以直接用String对象的indexOf()方法。但是对于较为复杂的模式匹配则需要使用search()方法,他提供正则表达式元字符以更好的限定表达式。

var str = "I love the smell of clover.";
var regex = /love/g;
var index = str.search(regex);
alert(index);

replace()方法用来查找某字符串并将其替换为另一个字符串。修饰符i用来忽略大小写,修饰符g用于全局替换,也就是说所有找到的匹配都将被替换。replace()方法也可以用来对元字符分组。

var str = "I love the smell of clover.";
var regex = /love/g;
var str_r = str.replace(regex, "LOVE");
alert(str_r);

split()方法是将单个文本字符串分割成子字符串数组。这个没啥好说的,直接看实例。

var str = "apples:pears:peaches:plums:oranges";
var regex = /:/;
var str_array = str.split(regex);
alert(str_array);

var str = "apples,pears,peaches:plums,oranges";
var regex = /[:,]/; //分隔符是冒号或逗号
var str_array = str.split(regex);
alert(str_array);

第一天算是完成。主要是要明白正则表达式要用在什么地方,如果理解了,就可以看第二天的教程了,如何写正则表达式。