this

Posted 2022-09-09 hy96

  定义：
         声明
     执行：
         函数名+()
    
     函数的定义的位置
     函数的执行的位置

     位置

     this：执行上下文，this一般存在于函数中，表示当前函数的执行上下文，如果函数没有执行，那么this没有内容，只有函数在执行后this才有绑定


    

     执行的位置!!!

     1.默认执行:fn()：this指向window,严格模式指向undefined
     function fn()
         // "use strict"
         console.log(this)
     
     fn()//undefined
　　

     function fn()
         // "use strict"
         console.log(this)
     
     fn()//window

    
     2.通过对象执行（通过上下文对象执行，隐式执行）:obj.fn()：当前的执行对象
         function fn()
             console.log(this)
         
         var a = 10;
         var obj = 
             a:20,
             b:fn
         
         obj.b();  //obj
         var obj2 = 
             a:30,
             b:obj.b 
         
         obj2.b(); //obj2
         var obj3 = 
             a:40,
             b:obj2
         
         obj3.b.b() //他执行的是b，obj2
    
         隐式丢失
         setTimeout(obj.b, 2000);
         function setTimeout(cb,t)  //obj.b相当于一个参数传到cb中，相当于赋值关系。给了一个地址，cb中存在的是obj.b的地址。
             // t
             cb()  //前面没有参数，默认执行，this是window
          
    
     3.显式执行（通过函数的方法bind执行）：指定的是谁，就是谁
         function fn()
             console.log(this)
         
         var f = fn.bind(window); 
         f(); //window

         找回隐式丢失的this，其实就是使用显式执行，强行绑定
         setTimeout(obj.b.bind(obj), 3000);  //obj



     谁执行了this所在的函数，this就是谁
    

     场景：
         1.默认执行：非严格模式下指向window
                 window || undefined
         2.隐式执行：通过任意对象执行
                 直接的执行对象
         3.显式执行：通过函数的bind或call或apply执行
                 写谁就谁


     function fn()
         console.log(this)
     
     var obj = 
     obj.fn = fn;

     obj.fn();       //obj

     var obtn = document.getElementById("btn");
     obtn.onclick = fn;
     // 点击时        //obtn

     fn.bind("hello")();     //"hello"

     var f = fn.bind(obj);
     f();             //obj

     fn();           //window




     4.构造函数执行（通过new执行）

 blind的使用：

 function fn(a)
         console.log(this)
         console.log(a)
         console.log(arguments)
     

      fn("admin")//window,admin,argumrnts

     var f = fn.bind("hello","zhangsan"); //
     f("root")  //hello ,zhangsan.


     bind()：执行结束后，会返回一个新函数，新函数是被改变了this和参数的老函数
     一种：一个参数：
     参数:表示this的指向
     二种：多个参数：
     参数1：表示this的指向
     参数2：会与原函数的参数一起放在新函数中
     ...
     bind将新的参数和老的参数，一起传给了新的函数

     改变this指向

     var obj = 
         name:"obj",
         show:function()
             console.log(this.name)
         
     
     obj.show()//obj

     var obj2 = 
         name:"obj2"
     
     obj.show.bind(obj2)(); //this被改为了obj2，相当于输出obj2.name

     var name = "zhangsan";
     obj.show.bind(window)(); //name是全局变量，全局变量绑定在window上。window.this就是zhangsan

     this只能是对象