js常见this指向问题

关于this的总结
<script>
    //全局环境 和 普通函数中this指的是是windows
    console.log(this) //windows
    function abc() {
        console.log(this) //windows
    }
    abc()
    //事件中的this是被侦听的对象 document
    document.addEventListener("click",clickHander)
    function clickHander(e){
        console.log(this) //document
    }
    //对象方法中的this 指的是当前的函数所在的对象
    var obj = {
        a:1,
        b:function(){
            console.log(this)
        }
    }
    obj.b()  //obj
    var obj2 = Object.create(obj)
    obj2.name="zhang san"
    obj2.b() // obj2  原型链继承
    //构造函数中this指代的是new出来的对象
    function Person(){
        
    }
    Person.prototype={
        name:"li si",
        age:"18",
        c:function(){
            console.log(this===one) //true
        }
    }
    one = new Person()
    one.c()
    //构造函数es6 this指代的也是new出来的对象
    class Ball{
        constructor(){

        }
        paly(){
            console.log(this===ball) //true
        }
    }
    ball = new Ball()
    ball.paly()
    //call apply bind  绑定this 混入模式 对象混入到函数中
    function bindHander(a,b){
        this.a=a;
        this.b=b;
    }
    bindHander(3,5)
    console.log(this.a,this.b) // 3 5 this 指的是windows会为windows增加两个变量a和b

    var objs = {};
    bindHander.call(objs,3,5)
    console.log(objs) // this 指的是objs 并且增加两个属性a b 值为 3 5 

    bindHander.apply(objs,[3,5]) //接受两个参数 且第二个必须是数组
    console.log(objs) // this 指的是objs 并且增加两个属性a b 值为 3 5 

    bindHander.bind(objs)(3,5);
    console.log(objs) // this 指的是objs 并且增加两个属性a b 值为 3 5
    //闭包中的this
    var name = "windows"
    var object = {
        name:"object",
        getName:function(){
            return function(){
                return this.name
            }
        }
    }
    console.log(object.getName()()) // windows
    var name = "windows"
    var object = {
        name:"object",
        getName:function(){
            var _this=this
            return function(){
                return _this.name
            }
        }
    }
    console.log(object.getName()()) // object

    var name = "windows"
    var object = {
        name:"object",
        getName:function(){    
            return this.name     
        }
    }
    console.log(object.getName())  // object
    console.log((object.getName)())   // object

</script>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值