都在说如何改变this指向,那么我们为什么要改变this的指向呢?

什么是this?

根据单词大意很容易理解 this 即是当前的代表,在很多语言中都有this关键字,JS在运行过程中会产生执行上下文环境(context),context记录了包含函数在哪里被调用,作用域scope,this等信息。this就是context的其中一个属性,会在函数的执行过程中使用。This是在运行时候绑定的,它指代的上下文对象取决于函数调用的各种条件。

为什么需要改变this指向?

demo
let _obj = {
    
    
            point:1,
            methods:function(){
    
    
                this.point++
                console.log('当前对象内部的points',this.point);
            }
       }

       //setInterval(_obj.methods,1000) // 因为是异步的所以会导致this为window对象而不是_obj 所以应该使用bind改变this的指向
       setInterval(_obj.methods.bind(_obj),1000)

在以上demo中 可以看到setInterval(_obj.methods,1000)的输出结果是NaN,究其原因是因为在js中this是根据函数的执行过程中进行上下文的一个this指向的绑定的,因为setInterval是异步的所以在执行过程中this的指向变为了window,而此时如果想要正确的运行我们的程序,则需要我们进行改变this的指向,使用bind()函数

如何改变this指向?

  • apply()函数
  • call()函数
  • bind()函数

使用示例:

 let fun = function(a,b){
    
    
        let name = '张三---------'
        console.log('函数内部的name',name);
        console.log(this);
        console.log('通过bind绑定的外部的name',this.name,'传递的参数a-b',a,b);
       }
       fun()
       let s = fun.bind(obj) // 并不会自己进行执行 需要自己手动调用
       s(12,45)
       let ap = fun.apply(obj,[4,5]) // 与call相同都会自己执行 参数为数组形式
       let cal = fun.call(obj,4,5) // 参数为单个

猜你喜欢

转载自blog.csdn.net/weixin_53191752/article/details/131140266