1、创建正则表达式

1-1.定义正则表达式

正则表达式：规定字符串出现规律的表达式
var reg = //

<!-- 
        正则表达式：规定字符串出现规律的表达式
     -->
     <script>
        var str = "你好你的你们"
        var reg = /你/g;
        /* g修饰符--全局搜索 */ 
        console.log(str.replace(reg,"*"))
     </script>

1-2.构造函数正则表达式

通过构造函数创建正则表达式(了解/不推荐)
var reg = new RegExp(//,”g”)

<script>
        /* 通过构造函数创建正则表达式(了解/不推荐) */ 
        var reg = new RegExp(/你/,"g");     //声明的一个过滤的规则
        var str = "你们你好";
        console.log(str.replace(reg,"*"));
    </script>

2、字符集（原子表元字符）

2-1.备选字符集（原子表）

备选字符—规定某一位字符的备选字符列表
特点:多个里面选一个

<script>
        /* 备选字符--规定某一位字符的备选字符列表
        特点:多个里面选一个
        */
        var str = "上海，上天，上哪";
        var reg = /上[海天哪]/g;
        console.log(str.replace(reg,"*"))
        var s = "你sb，他sx，她sd";
        var r = /s[bxd]/g;
        console.log(s.replace(r,"*"))
    </script>

备选字符集
[0-9] 所有数字
[a-z] 所有小写字母
[A-Z] 所有大写字母
[A-z] 所有字母

<script>
        /* 备选字符集
        [0-9]
        [a-z]
        [A-Z]
        [A-z]
        */ 
        var str = "asd1564asdaw48TM";
        var reg = /[0-9]/g;
        console.log(str.replace(reg,"*")); 
        console.log(str.replace(/[a-z]/gi,"*"));
        console.log(str.replace(/[A-z]/g,"*"));
        // i--忽略大小写
    </script>

2-2.预定义字符集（元字符）

备选字符集 预定义字符集
[0-9] \d
[0-9A-z_] \w
除换行符外所有 .
空格与换行符 \s

<script>
        /* 
        备选字符集      预定义字符集
          [0-9]            \d
          [0-9A-z_]        \w
          除换行符外所有     .
          空格与换行符      \s
        */ 
       var str = '45sa6d4asd5a  sd4a@@\n--';
       var reg = /\d/g;
       console.log(str.replace(reg,"*"));
       reg = /\w/g;
       console.log(str.replace(reg,"*"));
       reg = /./g
       console.log(str.replace(reg,"*"));
       reg = /\s/g
       console.log(str.replace(reg,"*"));
    </script>

3、转义字符

\字符转译有歧义的字符

<script>
        var a = "hello.world";
        /* \字符转译有歧义的字符 */ 
        var reg = /\./;
        console.log(a.replace(reg,"*"));
    </script>

4、量词

4-1.自定义量词

规定字符出现的次数
量词 {6}
正则函数 test()

<script>
        /* 规定字符出现的次数
        量词    {6}
        */
        /* 正则函数 test() */
        var reg = /^\d{6}$/;
        var pwd = 123456;
        console.log(reg.test(pwd));
    </script>

{m} 只出现m次
{m,} 至少出现m次
{m,n} 至少出现m次，至多出现n次

<script>
        /*
        {m}     只出现m次
        {m,}    至少出现m次
        {m,n}   至少出现m次，至多出现n次
        */ 
       var str = "454525455fasd"
       var reg = /\d{6,}/
       console.log(reg.test(str));
    </script>

4-2.预定义量词

? {0,1}
+ {1,}
* {0,}

<script>
        /*
        ?   {0,1}
        +   {1,}
        *   {0,}
        */ 
       var str = "hello123"
       var reg = /[a-z]+/
       console.log(str.replace(reg,"*"))
       console.log(str.replace(/[a-z]*/,"*"))
    </script>

5、贪婪和懒惰

5-1.贪婪模式

贪婪模式：在给定量词的情况下，会默认取最大的量词
只要正则表达式的某一段满足，就输出结果为true
tips：+,*量词默认就是贪婪模式

<script>
        /* 贪婪模式：在给定量词的情况下，会默认取最大的量词 */ 
        var str = "1231234hello";
        var reg = /\d{3,6}/;
        console.log(str.replace(reg,"*"));
        /* 只要正则表达式的某一段满足，就输出结果为true */ 
        console.log(reg.test(str));
        /* tips:+,*默认就是贪婪模式 */ 
    </script>

5-2.懒惰模式

懒惰模式 —{}?
取最小满足的量值

<script>
        var str = "123456hello";
        /* 懒惰模式 --{}? */ 
        var reg = /\d{3,6}?/;
        console.log(str.replace(reg,"*"))
    </script>

6、选择和分组

| 选择
() 分组

<script>
        /*
        |   选择
        ()  分组
        */
       var str = "你去哪里，他在..."
       var reg = /你去|他在/g;
       console.log(str.replace(reg,"*"));
    </script>

7、边界约束

^…$ —边界约束
严格控制与正则表达式的格式
^…控制开头格式
…$控制结束格式
^…$ 控制全部格式

<script>
        /* ^...$    --边界约束
        严格控制与正则表达式的格式
        */ 
        var phone = "02788667777"
        var reg = /^(027)?8\d{7}$/;
        console.log(reg.test(phone));
    </script>

<script>
        var str = "fdjasd1231"
        var reg = /^\d+/;
        console.log(reg.test(str))
        console.log(/\d+$/.test(str))
        var str = "     hello    "
        var reg = /(^\s+)|(\s+$)/g;
        console.log(str.trim());
        console.log(str.replace(reg,""))
    </script>

8、非

/[^…]/ 选择非输入内容
/D 选择非数字 （其他大写元字符相同）
…

<script>
        var str = "abc123"
        var reg = /[^abc]/g;
        console.log(str.replace(reg,"*"));
        var test = "?@hello123-"
        reg = /\D/g;
        console.log(test.replace(reg,"*"));
    </script>

！9、数据类型的区别

基本数据
number,string,boolean
引用数据
Array,Function,Object

<script>
        /* 基本数据
        number,string,boolean
        */ 
        /* 引用数据
        Array,Function,Object
        */
       var a = 20;
       console.log(a);
       var b = 10;
       a = 30;
       console.log(a)
    </script>

基本数据类型在赋值运算=
只传值

<script>
        /* 基本数据类型在赋值运算=
        只传值
        */
        var a = 20;
        var b = a;
        a = 30; 
    </script>

引用数据类型
占两块内存 —栈和堆
栈中存数据名和指针
堆中存属性和值

赋值运算=时，赋予的是栈中的指针，指向同一个

<script>
        /* 引用数据类型
        占两块内存  --栈和堆
        栈中存数据名和指针
        堆中存属性和值
        赋值运算=时，赋予的是栈中的指针，指向同一个值
        */ 
        var obj = {
            name:"李四"
        }
        var wang = obj;
        obj.age = 18;
        wang.sex = "男"
        console.log(obj);
        console.log(wang);
    </script>

例子

1.将对象中name属性的非中文转化为。。。

<script>
        var str = "https://www.baidu.com/123456"
        var reg = /\d+/g;
        console.log(str.replace(reg,""));
        var arr = [
            {id:1001,name:"你好456sdd"},
            {id:1002,name:"年少多金45asdw6sdd"},
            {id:1003,name:"asdasd暗示你点击456sa55dsdd"}
        ]
        arr.forEach(item=>{
            item.name = item.name.replace(/\w+$/g,"")+"...";
            console.log(item);
        })
    </script>

2.判断输入的数字是否为中国境内电话号

<input type="text" id="app">
    <script>
        var reg = /^(086)?1[3-9]\d{9}$/
        $("#app").keyup(function(event){
            if(event.keyCode==13){
                var value = $(this).val();
                console.log(reg.test(value));
            }
        })
    </script>

3.判断输入的密码是否为大写字母加小写字母开头且至少6位数字

<input type="text" placeholder="请输入密码" id="app">
    <script>
        var reg = /^[A-Z]+[a-z]+\d{6,}$/;
        $("#app").keyup(function(event){
            if(event.keyCode==13){
                var value = $(this).val();
                console.log(reg.test(value));
            }
        })
    </script>

4.提取文字段中的部分组成数组

<p class="">
        导演: 陈凯歌 Kaige Chen&nbsp;&nbsp;&nbsp;主演: 张国荣 Leslie Cheung / 张丰毅 Fengyi Zha...<br>
        1993&nbsp;/&nbsp;中国大陆&nbsp;/&nbsp;剧情 爱情 同性
    </p>
    <script>
        var str = $("p").html().trim().split("<br>")[1].trim();
        console.log(str);
        var reg = /&nbsp;/g
        var res = str.replace(reg,"");
        var arr = res.split("/")
        var last = arr[arr.length-1].split(" ");
        arr.pop();
        console.log(last);
        last.forEach(item=>{
            arr.push(item);
        })
        console.log(arr);
    </script>

5.将地址中的数字每两位一个数组组成2维数组

<script>
        var url = "https://movie.douban.com/subject/129205/"
        var reg = /\D+/g
        var str = url.replace(reg,"");
        console.log(str);
        var arr = str.split("");
        console.log(arr);
        var res = []
        for(var i=0;i<str.length;i+=2){
            var item =str.substr(i,2).split("")
            res.push(item);
        }
        console.log(res);
    </script>