JavaScript学习DAY13

DAY13

一、自调用函数
		函数定义方式
           声明式
            function fn(){
            	console.log('fn函数')
            	}
            fn()

           赋值式
             var 函数名 = function(){
                 console.log('赋值式函数')
             }
            函数名()  函数调用语句

         自调用函数
           (function(){
            	//函数体
            	console.log('自调用函数>>>')     
           })()
二、this关键字

​ this 是什么 是一个关键字

​ 只出现在 作用域里面(全局作用域、私有作用域)

​ 目前 this 只有 全局作用域和函数(私有作用域里面有)

​ this指向(代表什么)

//全局作用域
console.log(this)   // window

this 指向(熟读并且背诵全文)

1、全局定义直接调用,函数名()调用 函数内部 this 指向 window
	function fn(){
            console.log(this)	//(this指向window)
        }
 	fn()		

2、对象内部的方法调用,函数内部 this 指向 . 前面的这个东西
	var obj1 = {
            name:'Taogu',
            sayHi:function(){
                console.log(this)   //(this指向obj1)
            }
        }
    obj1.sayHi()  

3、定时器    this ->window
	setTimeout(function(){
           console.log(this)	//(this指向window)
     },1000)

 4、自调用函数 this->window
	(function(){
            console.log(this)	//(this指向window)
    })()

5、事件处理函数 this 指向事件源(由谁触发的这个事件) 
	box.onclick  = function (){
            console.log(this)	//(this指向box)
        }    

6、构造函数中this -> 调用该方法的实例对象
	<button class="btn">按钮</button>
	
	let btn =  document.querySelector('.btn')
    function Person(name){
            this.name = name
            this.say = function(){
                console.log('构造函数中this ',this)   //(this指向Person)
            }
        }

7、原型方法中中this -> 调用该方法的实例对象
        Person.prototype.playGame = function(){
            console.log('原型方法中this ',this)	//(this指向Person)
            let _this = this
            btn.onclick = function(){
                console.log('btn this ',_this.name)

            }
        }
	let p1 = new Person('Jack')
     p1.say()
     p1.playGame()
    let p2 = new Person('Rose')
二、call 和 apply 和 bind
1、call

语法:函数名.call(要改变的this指向对象,参数列表)

var obj = {
	name : 'jack',
	age:23
}
function fn(x,y,z){
    console.log(x,y,z)
    console.log(this) //this->window
}
fn(1,2)   //函数内部的this指向window
fn.call(obj,1,2)    //函数内部的this指向obj这个对象
2、apply

语法:函数名.apply(this指向的对象,[参数1,参数2…])

fn(1,2,5)    //函数内部的this指向window
fn.apply(obj,[1,2,5])    //函数内部的this指向obj这个对象
3、bind

bind方法是附加在函数调用后面使用,可以忽略函数本身的this指向

语法:var newFn = 函数名.bind(要改变的this指向);newFn(传递参数)

var newFn = fn.bind(obj)
fn(2,3,4)   //函数内部的this指向window
newFn(2,3,4)  //函数执行的是一个和fn一模一样的函数,只不过里面的this指向改成了obj
二、正则表达式
  • 正则表达式,又名 “规则表达式”

  • 由我们自己来书写 “规则”,专门用来检测 字符串 是否符合 “规则” 使用的

        //通过正则表达式去完成 正则里面d表示字母 \d表示数字0-9
        //+ 连续进行匹配 
        //g 表示全局匹配 指的是整个字符串
        var res = str.match(/\d+/g);
        console.log(res);    
        alert('用户名太受欢迎,请重新换一个');
    
    	//连接符
               [1-9]
               [a-z]
               [A-Z]
               [1-9a-zA-Z]
    	//修饰符
               g  继承正则匹配,全文搜索,直到结束为止,
                  默认,匹配到第一个结束
               i: 忽略大小写,默认大小写敏感
    
    
    正则的作用是描述字符的规则,检查字符存不存在有没有问题
        正则构造函数方式
        创建了一个检查某个字符串里面有没有a这个字符的规则 
        使用正则提供的test()方法检查,如果有返回true 没有返回false
    
        var str = 'b';
        var reg = new RegExp('b', i);
        console.log(typeof reg); 
        检查str这个字符串里面有没有a这个字符
        var res = reg.test(str);
        console.log(res);    
    
        字面量 数组 [] 对象 {} 正则//
        修饰符 i 忽略大小写
        修饰符 g 全局匹配
        var str = 'A';
        var reg = /a/i;
        var res = reg.test(str);
        console.log(res);
    
三、元字符
   1、\d   有一个数字(只要有一个数字就满足条件)
    var str = 'abc123'
    var reg = /\d/
    var res = reg.test(str)
    console.log(res)  

    2、\D  有一个非数字
    var str = '123'
    var reg = /\D/
    var res = reg.test(str)
    console.log(res)

    3、\s  有一个空白符,如空格,换行符,制表符等
    var str = '1a b c 23'
    var reg = /\s/
    var res = reg.test(str)
    console.log(res)

    4、\S  有一个非空白符的字符
    var str = '          '
    var reg = /\S/
    var res = reg.test(str)
    console.log(res)
    5、\w   有一个数字或者字母或者下划线   
    var str = '1a b c 23'
    var reg = /\w/
    var res = reg.test(str)
    console.log(res)

    6、\W  有一个非数字或者字母或者下划线
    var str = '1a b c 23'
    var reg = /\W/
    var res = reg.test(str)
    console.log(res)
    7. 有一个除了换行以外的其他字符
    var str = '\n'
    var reg = /./
    var res = reg.test(str)
    console.log(res)
四、限定符

限定符就是用来限定元字符出现的次数

	1* 表示有一个数字出现 0 - 正无穷次
    var str = 'abc'
    var reg = /\d*/
    var res = reg.test(str)
    console.log(res)
    2+ 出现 1 - 正无穷次  至少有一次
    var str = '123a321bc'
    var reg = /\d+/
    var res = reg.test(str)
    console.log(res)
    console.log(reg.exec(str));   //至少有一个 exec()可以返回匹配到的个数,返回的是一个数组
    3? 出现 0 - 1最多出现一次(看的单个,1,2,3只有有一个出现了0-1次,都是true)
    var str = '123abc321'
    var reg = /\d?/
    var res = reg.test(str)
    console.log(res)
    4{n}  出现 n (只要有出现3次的都为true)
    var str = '123456abc'
    var reg = /\d{3}/
    var res = reg.test(str)
    console.log(res)
    5{n,}  出现 n - 正无穷次
    var str = 'a123456bc'
    var reg = /\d{3,}/
    var res = reg.test(str)
    console.log(res)
    6{n,m}  出现 n - m 次
    var str = 'abc1234'
    var reg = /\d{2,3}/
    var res = reg.test(str)
    console.log(res)
五、边界符(量词)

​ ^ 以 … 开头
​ $ 以 … 结尾

 	    var str = '123'
        var reg = /^\d{2}$/   // 以数字开头以数字结尾 总共出现两次
        var res = reg.test(str)
        console.log(res)
		   1| 占位或  || 逻辑或
            2() 把一堆东西当成一个整体
            var str = '1234'
            var reg = /^(\d|\s)$/  // 以一个数字或者一个空格开头并且结尾 总共出现一次
            var res = reg.test(str)
            console.log(res)
            3[]  里面的东西任选一个
            4- 至 到
            var str = 'a123'
            var reg = /^[0-9a-zA-Z_]$/  //0-9a-zA-Z_相当于\w   这个字符串总共长度就只有一个()
            var res = reg.test(str)
            console.log(res)  (false)
            5、\ 转义符  
            本身没有特殊函数的字符加上 \ 就有了特殊含义
            本身有特殊含义的字符 加上 \ 就没有了特殊含义
            6[^]var str = ' '
            var reg = /^[^0-9]$/  // 以一个非数字开头并且结尾 总共就一位
            var res = reg.test(str)
            console.log(res)true
六、验证0-255数字
		// 0 - 255
        // 一位数
        //       0 - 9 
        // 二位数
        //       第一位 1 - 9  第二位 0 - 9
        // 三位数
        //       第一位 1  第二位 0 - 9  第三位 0 - 9  
        //       第一位 2  第二位 0 - 4  第三位 0 - 9
        //                  第二位 5   第三位 0 - 5
        var reg = /^([0-9]|[1-9]\d|1\d{2}|2[0-4]\d|25[0-5])$/
        var str = '256'
        var res = reg.test(str)
        console.log(res)
七、正则的方法

1、test() 是用来检测字符串是否符合我们正则的标准 有返回true
2、exec() 是把字符串中符合条件的内容捕获出来 有返回数组

​ 返回值: 把字符串中符合正则要求的第一项以及一些其他信息,以数组的形式返回

八、正则标识符

1、g 全局匹配
2、i 忽略大小写

九、配合正则使用的字符串的方法
    1、replace()   //是将字符串中满足正则条件的字符串替换掉
    var str = 'dsSMdkmsdaSMkdsjafSMdksadSM'
    var res = str.replace(/SM/g,'**')
    console.log(res)

    2、search()   //找到字符串中符合正则条件的内容返回
    var str = 'dsada123sdas432dsad'
    var reg = /\d{3}/
    var res = str.search(reg)
    console.log(res)

    3、match()   //把所有匹配到的字符放到一个数组里面返回
    var str = '123asd435dsa434fsdg656gdfg657'
    var reg = /\d{3}/g
    var res = str.match(reg)
    console.log(res)
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值