this指向问题

this的几种基本情况说明

1. 我们研究的this，都是研究函数私有上下文中的this

• 因为全局上下文中的this->window
• 块级上下文中没有自己的this，在此上下文中遇到this，都是其所处环境（上级上下文）中的this
• ES6中的箭头函数和块级上下文类似，也是没有自己的this，遇到的this也是其上级上下文中的

{
   console.log(this);
   let a = 12;
}

2. this是执行主体，谁把他执行的 [与在哪定义、在哪执行都没有必然的关系]

3. 规律：

   1. 给DOM元素进行事件绑定，当事件行为触发，绑定的方法执行，方法中的this是当前DOM元素本身

   document.onclick = function() {
    console.log(this);//document
   };
   document.addEventListener('click', function() {
    console.log(this);//document
   })
   

   2. 当方法执行，看函数前面是否有点，
      1. 有点，点之前是谁this就是谁，
      2. 没有，this是window或者undefined（严格模式“use strict”）

       const fn = function fn() {
           console.log(this);
       }
       let obj = {
           name: 'OBJ',
           fn: fn
       };
       fn();//window
       obj.fn()
   

    	3. 匿名函数（自执行函数或者回调函数）中的this一般都是window/undefined，除非做过特殊处理
   

     //自执行函数：创建完立即执行
     //(function(){})();
    (function(x){
        console.log(this);//window/undefined
    })()
   
    //回调函数：把一个函数作为参数传给另外一个函数[在另一个函数中，把其执行]
    const fn = function fn(callback) {
        callback();
    }
    fn(function() {});
   
    setTimeout(function() {
        console.log(this);//是否为严格模式 都为window
    }, 1000);
   
    let arr = [10, 20];
    let obj = {name: 'zs'};
    arr.forEach(function(item, index) {
        console.log(this);//window/undefined
    })
   
    //做特殊处理，更改this
    arr.forEach(function(item, index) {
        console.log(this);//obj
    }, obj)//forEach([回调函数],[修改回调函数中的this])
   

   3. 构造函数体中的this是当前类的实例

        function Factory() {
            this.name = 'zs';
            this.age = 12;
            console.log(this);
        }
        let f = new Factory;
   

   4. 箭头函数中没有执行主体，所用到的this都是其所处上下文中的this

    let demo = {
        name: 'DEMO',
        fn() {
            console.log(this);//demo
            setTimeout(function() {
                console.log(this);//window
            },1000);
            setTimeout(()=>{
                console.log(this);//demo
            },1000);
        }
    }
   

   5. 可以基于Function.prototype上的call/apply/bind去改变this指向