fn.call（）与fn.apply（）

   "use strict" // 严格模式
       function fn() {

            console.log(this);


         }

       fn() //严格模式时this指向undefined，非严格模式时this指向window

       var o = { a: 1 }

       // 执行函数时不管有没有严格模式，改变函数内的this指向

 1.  fn.call(o) // {a: 1} 当使用call将对象放入到call的第一个参数中，在函数中的this指向这
         个第一个参数对象

 2.  fn.apply(o) // {a: 1} //当使用apply将对象放入到apply的第一个参数中，在函数中的
          this指向这个第一个参数对象
          
          
          
          

非严格模式时call和apply

  function fn() {

            console.log(this);


         }


        fn.call(null) //this指向window

        fn.apply(1)// Number {1}

        fn.call(1)// Number {1} //放入非对象类型，会自动转换为该类型的对象类型     
        number-- >Number  string-->String boolean->Boolean
       
        fn.call(undefined)  //this指向window
        
        

严格模式时call和apply

        function fn() {

            console.log(this);


         }


        fn.call(null);//指向null

        fn.call(undefined);//指向undefined

        fn.call(1);//1
        
        
        

call与apply 深入

    function fn(a, b) {

            console.log(this, a, b);

        }

        fn(1, 2);//非严格模式，this指向window， a=1, b=2

       // call与apply  有没有严格模式都改变this指向

        var o = { a: 1 }

        // call的参数填入，第一个参数是this的指向，后面的参数一个个填入等同于函数执行参数的
        顺序

        fn.call(o, 1, 2)//this指向对象o，a=1 ，b=2

        // apply就两个参数，第一个参数是this的指向，第二个参数是一个数组，数组中的元素放入函 
        数中所有的参数
       

        fn.apply(o, [1, 2]);//this执行对象o， a=1， b=2;



        数组转对象

            var arr=[1,2,3];

            function fn(a,b,c){

                this.a=a;

                this.b=b;

                this.c=c;

                return this;

            }


           var o=fn.apply({},arr);

           console.log(o);//{a: 1, b: 2, c: 3}
           
           
           

bind

        call、apply立即执行函数

        bind会把函数内的this指向改变，但是不会立即执行，当后续调用时，this就会执行bind绑定
        的对象了

     1.   function fn(a, b) {

            this.a = a;

            this.b = b;

            return this;

        }

        var o = {}

        fn.bind(o)// 会返回一个新的函数（f），这个函数里面的this已经被指向为o对象了

         // f这个函数中的this被指向了o对象，但是fn函数自身的this还是指向window

         var f=fn.bind(o)

         var o1=f(1,2)
         console.log(fn(2,3)) //this指向window
         console.log(o1);// {a: 1, b: 2}
         
         
         
    2.    var o={a:1}

        setTimeout(function(a,b){

            console.log(this,a,b); //两秒后出现 {a: 1} 1 2

            //.bind(o)

        }.bind(o),2000,1,2)


   3.   function fn(a, b, c) {

            console.log(this, a, b, c);

        }    

      // bind后面传入了前面的参数，所以执行函数时，函数传入剩余的其他参数
      
      3.1：var f = fn.bind({ a: 1 }, 1)
         f(2, 3) //{a: 1} 1 2 3

      3.2： var f = fn.bind({ a: 1 }, 1, 2);

         f(3); // {a: 1} 1 2 3

         var f=fn.bind({a:1},1,2,3);

         // 参数只有三个，已经有bind传入

         // 再传参数 结果还是不变

        f(4); //  {a: 1} 1 2 3

        f("a") // {a: 1} 1 2 3
                         

类与bind

           class Box{

            a=1;

            b=2

            constructor(){

                console.log(this); //Box {a: 1,b:2}

                console.log(this.a); // 1

                // document.addEventListener("click",this.clickHandler);

                // document 页面

                //下边的this 都指向全局 ，

                document.addEventListener("click",this.clickHandler.bind(this)); //

                document.addEventListener("click",e=>this.clickHandler(e));

            }
                clickHandler(e){

                  console.log(this);//Box {a: 1, b: 2}
                  console.log(this.a);//1

                }

            }

            new Box();




        call apply是立即执行函数，目的是在立即执行函数时，转换函数中this的指向

        bind时返回一个被绑定this指向以后的函数，当回调当前函数值，可以获取之前被绑定的this指
        向