JS学习 | 正则表达式

111 阅读1分钟

1.1 什么是正则表达式

匹配字符串中字符组合的模式
常见使用场景:
验证表单,比如用户名只能输入字母、数字、下划线
过滤页面中的敏感词(替换),或者从字符串中获取我们想要的特定部分(提取)

1.2 语法

  • 定义正则表达式语法
const 被检测字符串 = 'xxxx'
const reg = /表达式/ 
  • 判断是否有符合规则的字符串
    test()方法 用来查看正则表达式与指定的字符串是否匹配,返回 true 或者 false
reg.test(被检测的字符串)
  • 检索符合规则的字符串:
    exec()方法 在一个指定字符串中执行一个搜索匹配,返回 数组或是null
reg.exec(被检测的字符串)

1.3 元字符

是一些具有特殊含义的字符,可以极大提高了灵活性和强大的匹配功能。
比如,规定用户只能输入英文26个英文字母

  • 普通字符的话abcdefghijklm.....
  • 但是换成元字符写法:[a-z]

元字符分类

  • 边界符(表示位置,开头【^】和结尾【$】
  • 量词(表示重复次数)
    • *(>=0)
    • +(>=1)
    • ?(0或者1)
    • {n}(重复n次 )
    • {n,} (>=n次)
    • {n,m} (重复n到m次)
  • 字符类(比如\d表示0-9)
    • [a-z] a-z中的任意一个
    • [0-9] 0-9中的任意一个
    • [^0-9] 除了0-9中的任意一个
    • 预定义 \d表示0-9 \w 匹配任意的字母数字,下划线

1.4 修饰符

修饰符约束正则执行的某些细节行为,如是否区分大小写、是否支持多行匹配等 语法:/表达式/修饰符
替换replace替换
语法: 字符串.replace(/正则表达式/,'替换的文本')

<body>
<textarea name="" id="" cols="30" rows="10"></textarea>
<button>发布</button>
<script>
    const tx = document.querySelect('textarea')
    const tx = document.querySelect('button')
    const tx = document.querySelect('div')
    btn.addEventListener('click',function()){
        div.innerHTML = tx.value.replace(/激情|爱情/g,'**')
        tx.value = ''
    }
</script>
/body>