JS高级 - 正则表达式

正则表达式的定义

正则表通常被用来检索、替换那些符合某个模式(规则)的文本

正则表达式的作用

给定的字符串是否符合正则表达式的过滤逻辑(匹配)

可以通过正则表达式，从字符串中获取我们想要的特定部分(提取)

强大的字符串替换能力(替换)

正则表达式的特点

灵活性、逻辑性和功能性非常的强

可以迅速地用极简单的方式达到字符串的复杂控制

常用元字符

元字符	说明
\d	匹配至少有一个数字
\D	匹配至少任意一个非数字的字符
\w	匹配至少一个字母或数字或下划线
\W	匹配至少有一个不是字母，数字，下划线
\s	匹配至少任意的空白符
\S	匹配至少一个不是空白符的字符
.	匹配至少有一个非换行符
^	表示匹配行首的文本(以谁开始) ^\d
$	表示匹配行尾的文本(以谁结束)\d$

限定符

限定符	说明
*	重复零次或更多次\d*  /^ab*$/：表示一个字符串有一个a后面跟着零个或若干个b。（"a", "ab", "abbb",……）；
+	重复一次或更多次\d+     / ab+/：表示一个字符串有一个a后面跟着至少一个b或者更多；
?	重复零次或一次    /^ab?$/：表示一个字符串有一个a后面跟着零个或者一个b；
{n}	至少重复n次
{n,}	重复n次或更多次
{n,m}	重复n到m次

其他符号

[] 字符串用中括号括起来，表示匹配其中的任一字符，相当于或的意思 [0-9]

[^]  匹配除中括号以内的内容

\ 转义符： \的用法 \ 主要是用法是在正则表达式中的特殊符号转换为它本身的意思

| 或者，选择两者中的一个。注意|将左右两边分为两部分，而不管左右两边有多长多乱

() 从两个直接量中选择一个，分组

eg：gr(a|e)y匹配gray和grey

[\u4e00-\u9fa5]  匹配汉字

创建正则对象

(1)、字面量创建

  var reg1 = /\d/;

(2)、构造函数创建

 var regObj1 = new RegExp(/\w/);

正则匹配

RegExp.prototype.test()

语法：regexObj.test(str)

参数：str 用来与正则表达式匹配的字符串

返回值：如果正则表达式与指定的字符串匹配 ，返回true；否则false。

正则提取

String.prototype.match()

语法：str.match(regexp)

参数：regexp

参数

标志	说明
i	忽略大小写
g	全局匹配
gi	全局匹配+忽略大小写

.正则替换

String.prototype.replace()

replace() 方法返回一个由替换值（replacement）替换一些或所有匹配的模式（pattern）后的新字符串。模式可以是一个字符串或者一个，替换值可以是一个字符串或者一个每次匹配都要调用的回调函数。

原字符串不会改变。

语法：str.replace(regexp|substr, newSubStr|function)

参数：regexp (pattern)

HTML5的web存储

localStorage 对象

保存数据：localStorage.setItem(key,value);

读取数据：localStorage.getItem(key);

删除单个数据：localStorage.removeItem(key);

删除所有数据：localStorage.clear();

得到某个索引的key：localStorage.key(index);

sessionStorage 对象

sessionStorage 方法针对一个 session 进行数据存储。当用户关闭浏览器窗口后，数据会被删除。

函数的防抖（debounce）与节流（throttle）

函数防抖（debounce）

短时间内多次触发同一事件，只执行最后一次，或者只执行最开始的一次，中间的不执行。

// 非立即执行版
function debounce(func, wait) {
    let timer;
    return function() {
  let context = this; // 注意 this 指向
      let args = arguments; // arguments中存着e
         
      if (timer) clearTimeout(timer);
 
      timer = setTimeout(() => {
        func.apply(this, args)
      }, wait)
    }
}