JavaScript 正则基础

🌙
手机阅读
本文目录结构

正则表达式的基础

  • 正则是什么
  • 如何创建一个正则
  • 如何学习正则
  • 正则的转义

1、正则是什么?

  • 正则:它就是一个规则,用来处理字符串的一个规则(正则就是用来处理字符串的)

  • 原理:

    • 1)匹配 判断一个字符串是否符合我们制定的规则->test:reg.test(str)

      var reg=/\d+/; console.log(reg.test(“朱”));//false console.log(reg.test(“1”));//true console.log(reg.test(1));//true console.log(reg.test(“朱朱朱111”));//true

    • 2)捕获 把字符串中符合我们正则规则的内容捕获到->exec:reg.exec(str)

      var reg=/\d+/; console.log(reg.exec(“朱”));//null console.log(reg.exec(“1”));//[“1”, index: 0, input: “1”] console.log(reg.exec(“朱朱朱111”));//[“111”, index: 3, input: “朱朱朱111”]

      正则捕获,如果比配,返回捕获匹配到了数据;如果不匹配,返回null;

2、如何创建一个正则?

  • 字面量方式:

    var reg = /\d/;

  • 实例创建方式:

    var reg = new RegExp("");

正则的两种创建方式是有区别的

  在字面量方式中,我们//之间包起来的所有的内容都是元字符,有的具有特殊的意义,大部分都是代表本身含义的普通的元字符

  var name = "zhuan";
  var reg = /^\d+"+name+"\d+$/g;
  console.log(reg.test("2015zhuan2016"));//->false
  console.log(reg.test('"2015"""zhuan2016""'));//->false
  console.log(reg.test('2015"""nameeeee"2016'));//->true

对于这样的需求,我们只能使用实例创建的方式了

	var name = "zhuan";
	// var reg = /^\d+"+name+"\d+$/g;
	var reg = new RegExp("^\\d+" + name + "\\d+$", "g");
	console.log(reg.test("2015zhuan2016"));//->true
	console.log(reg.test('2015"""nameeeee"2016'));//->false

字面量方式和实例创建的方式在正则中的区别?

  • 1)字面量方式中出现的一切都是元字符,所以不能进行变量值的拼接,而实例创建的正则表达式可以使用变量;
  • 2)字面量方式中直接写\d就可以,而在实例中需要把它转译 \d

要注意的是,传递给 RegExp 构造函数的两个参数都是字符串(不能把正则表达式字面量传递给 RegExp 构造函数)。由于 RegExp 构造 函数的模式参数是字符串,所以在某些情况下要对字符进行双重转义。所有元字符都必须双重转义,那些已经转义过的字符也是如此,例如 \n (字符\在字符串中通常被转义为\,而在正则表达式字符串中就 会变成\\)。

3、如何学习正则?

var name = "zhuan";
// var reg = /^\d+"+name+"\d+$/g;
var reg = new RegExp("^\\d+" + name + "\\d+$", "g");

console.log(reg);
console.dir(reg);//顺着原型链查找有哪些方法
console.dir(RegExp.prototype);//正则类的原型

4、正则转义

与其他语言中的正则表达式类似,模式中使用的所有元字符都必须转义。正则表达式中的元字符包括:

( [ { \ ^ $ | ) ? * + .]}

这些元字符在正则表达式中都有一或多种特殊用途,因此如果想要匹配字符串中包含的这些字符,就必须对它们进行转义;

//匹配第一个"bat"或"cat",不区分大小写
var pattern1 = /[bc]at/i;
console.log(pattern1.test("bat"));      //true
console.log(pattern1.test("cat"));      //true
console.log(pattern1.test("[bc]at"));   //false

//匹配第一个" [bc]at",不区分大小写
var pattern2 = /\[bc\]at/i;
console.log(pattern2.test("bat"));      //false
console.log(pattern2.test("cat"));      //false
console.log(pattern2.test("[bc]at"));   //true

//匹配所有以"at"结尾的 3 个字符的组合,不区分大小写
var pattern3 = /.at/gi;//注意index的变化
console.log(pattern3.exec("[bc]at"));   //["]at", index: 3, input: "[bc]at"]
console.log(pattern3.exec("bat"));      //null
console.log(pattern3.exec("cat"));      //["cat", index: 0, input: "cat"]

//匹配所有".at",不区分大小写
var pattern4 = /\.at/gi; 

AXIHE / 精选资源

浏览全部教程

面试题

学习网站

前端培训
自己甄别

前端书籍

关于朱安邦

我叫 朱安邦,阿西河的站长,在杭州。

以前是一名平面设计师,后来开始接接触前端开发,主要研究前端技术中的JS方向。

业余时间我喜欢分享和交流自己的技术,欢迎大家关注我的 Bilibili

关注我: Github / 知乎

于2021年离开前端领域,目前重心放在研究区块链上面了

我叫朱安邦,阿西河的站长

目前在杭州从事区块链周边的开发工作,机械专业,以前从事平面设计工作。

2014年底脱产在老家自学6个月的前端技术,自学期间几乎从未出过家门,最终找到了满意的前端工作。更多>

于2021年离开前端领域,目前从事区块链方面工作了