美文网首页编程系统分析师
什么是this指向?怎么改变this指向

什么是this指向?怎么改变this指向

作者: 拾柒_aab0 | 来源:发表于2019-10-30 16:52 被阅读0次

    对this的产生原因分析和了解

    this在函数定义时确定不了,只有在函数指向时才能确定,this就是谁调用指向谁,没有上一级即指向widow。
    第一:this指的是函数运行时所在的环境(即调用的对象)。
    第二:JavaScript 语言之所以有this的设计,跟内存里面的数据结构有关系
    第三:每一个方法或者是对象都有其this指向;
    举例:

    指向window

    例:

     function fn() {
        var name = '嘻嘻';
        console.log(this)//谁调用指向谁,指向window
        console.log(this.name)//空 this指向window,window中不存在所以为空
    }
    fn();
    

    指向上一级,假如调用这个函数的有多级对象,那么this指向的是调用它的上一级对象,例:

    var name='里斯';
     var obj = {
        name: '张三',
        b: function () {
            console.log(this);//指向上一级即整个对象
            console.log(this.name)//张三 指向上一级
        }
    }
    obj.b();
    

    当函数体被重新赋值后再调用,this指向window对象

    var foo = {
        a: 1,
        b: {
            a: 2,
            fn: function (a, b) {
    
                console.log(this) // 整个window对象
                console.log(this.a) // undefined
            }
        }
    }
    cc = foo.b.fn;//重新赋值
    cc();
    

    this指向总结

    就六个字 谁调用,指向谁。但是如果一个函数中有this,并且这个this没有被上一级调用,那么这个this的指向就是window。

    如果一个函数中有this,这个函数被上一级对象调用,那么this就指向上一级对象

    如果一个函数有this,假如调用这个函数的有多级对象,那么this指向的是调用它的上一级对象。

    怎么改变this指向:

    我们可以用apply(),bind(),call();这三个方法来改变this的指向。
    举例说明:

    var h = 168;
    var obj = {
        h: this.h,
        name: '林染',
        cc: function (aa, bb) {
            console.log(`${this.name}的身高是${this.h}厘米`)
        }
    }
    var newObj = {
        name: '李斯',
        h: 180,
    }
    obj.cc.apply(newObj);//李斯的身高是180厘米
    obj.cc.call(newObj);//李斯的身高是180厘米
    obj.cc.bind(newObj)();//李斯的身高是180厘米
    

    注:这三种方法在没有接收其他参数的情况下没有什么太大不同,但是bind()方法后必须加‘()’,否则会报错。

    var h = 168;
    var obj = {
        h: this.h,
        name: '林染',
        cc: function (aa, bb) {
            console.log(`${this.name}的身高是${this.h}厘米,但是${aa}的身高是${bb}厘米`)
        }
    }
    var newObj = {
        name: '李斯',
        h: 180,
    }
    obj.cc.call(newObj, '杰妮', 175);//李斯的身高是180厘米,但是杰妮的身高是175厘米
    obj.cc.apply(newObj, ['杰妮', 175]);//李斯的身高是180厘米,但是杰妮的身高是175厘米
    obj.cc.bind(newObj, '杰妮', 175)();//李斯的身高是180厘米,但是杰妮的身高是175厘米;
    

    总结:

    call()方法比较简单易操作;
    apply()在接收其他新的参数的时候,这些参数必须放在一个数组里;
    bind()在使用的时候必须加()。

    相关文章

      网友评论

        本文标题:什么是this指向?怎么改变this指向

        本文链接:https://www.haomeiwen.com/subject/ozrovctx.html