函数内部this指向的几种默认情况和改变this的指向

  <script>
    // 【1.在普通函数中的this】→ window
    function fn() {
      console.log(this);
    }  
    fn();

    var obj = {
      sayHi:function() {
        console.log(this);
        function fn1() {
          console.log(this);  // window
        }
        fn1();  
      }
    };
    obj.sayHi(); 
    
    // 【2. 在定时器中】→ window
    setTimeout/setInterval
    setTimeout(function(){
      console.log(this);
    },0);

    // 【3. 在构造函数中】→ 当前创建的对象
    function Person() {
      console.log(this);
    }
    new Person();

    // 【4. 在方法中】→ 指向调用者
    var obj = {
      name:'张三',
      sayHi:function() {
        console.log(this);
      }
    }
    obj.sayHi();

    // 【5. 在事件处理程序中】→ 
    document.onclick = function() {
      console.log(this); 
    };
  </script>

改变this的指向【重点】

call方法

• 语法：函数名.call(调用者,参数1…)
• 作用：函数被借用时，会立即执行，并且函数体内的this会指向借用者或调用者
• 代码：

 function fn(name, age) {
   this.name = name;
   this.age = age;
 }

 // 对象字面量
 var obj = {};
 fn.call(obj, '李四', 11);

apply方法

• 语法：函数名.apply(调用者,[参数1…])
• 作用：函数被借用时，会立即执行，并且函数体内的this会指向借用者或调用者
• 代码：

function fn(name, age) {
   this.name = name;
   this.age = age;
 }

 // 对象字面量
 var obj = {};
 fn.apply(obj, ['李四', 11]);

bind方法

• 语法：函数名.bind(调用者,参数1…)
• 作用：函数被借用时，不会立即执行，而是返回一个新的函数。需要自己手动调用新的函数。
• 代码：

 function fn(name, age) {
   this.name = name;
   this.age = age;
 }

 // 对象字面量
 var obj = {};
 fn.bind(obj, '李四', 11);