1. 普通函数的this

普通函数的this : this就是谁调用 this就指向谁 this是在调用的时候确定的

function f1(){
	console.log(this);
}
f1(); //window

2.对象里面的方法this

对象里面的方法,它里面的this指向当前这个对象

var obj = {
    a : 6,
    b : 7,
    name : "zhangshang",
    print(){
        // console.log(this.a + this.b);
        console.log(1111111);
        console.log(this);
    }
}
//obj.print();//{a:6,b:7,name: "zhangshang", print: ƒ}
var fn = obj.print;
//var fn = obj.print();//undefuned
//fn(); //this 指向 window // 1111111 window
obj.print = f1;
obj.f2(); // this 指向 obj //  {a: 6, b: 7, name: "zhangshang", print: ƒ, f2: ƒ}

3.特殊的 ：定时器 this

特殊的 ：定时器 this 在 普通函数中(包括对象中的this) 一定指向 window

setTimeout(f1,100);  //window
setTimeout(obj.print,100);   //window

setTimeout(obj.print(),100);   // 定时器里面的参数1是obj.print()的返回值undefined 和定时器的this指向没有任何关系 
//只是把obj.print()调用了一遍 相当于 打印的this 也是 指向 obj
var res = obj.print();  //this 指向 obj
setTimeout(res,100);

var name = "我在window里面";
var obj1 = {
    name : "我是obj1里面的",
    fn(){
        console.log(this);
        var that = this;
        console.log(that);
        setTimeout(function(){
            console.log(this.name); //  我是window里面的
            console.log(that.name); //  我是obj1里面的
        },1000)
    }
}
obj1.fn(); //this 指向 obj //{name: "我是obj1里面的", fn: ƒ}
//"我在window里面" "我是obj1里面的" 定时器里面打印内容 定时器里面的this在普通函数中一定指向window

4.在ES6 箭头函数里面的this

在ES6 箭头函数里面的this是继承自父级执行上下文中的this

箭头函数没有自己的this 它的this是从父级继承而来的 在声明的时候就已经确定了

var name = "我在window里面";
var obj1 = {
    name : "我是obj1里面的",
    fn(){
        console.log(this);//obj1
        var that = this;
        console.log(that);
        setTimeout(() => {  //箭头函数的this指向继承自父级执行上下文中的this 在声明的时候就已经确定了
            console.log(this.name); //  我是obj1里面的
            console.log(that.name); //  我是obj1里面的
        },1000);
    }
}
obj1.fn();

var name = "我在window里面";
var obj1 = {
    name : "我是obj1里面的",
    fn : () => { //父级也是箭头函数 那么它的this指向为（obj1对象执行上下文中的this）window
        console.log(this);//window
        var that = this;
        console.log(that);
        setTimeout(() => {  //箭头函数的this指向继承自父级执行上下文中的this 在声明的时候就已经确定了
            console.log(this.name); //  我是window里面的
            console.log(that.name); //  我是window里面的
        },1000);
    }
}
obj1.fn();

5.构造函数中的this

function Student(name,age){
    this.name = name;
    this.age = age;
    console.log(this);
}

1.把构造函数当成普通函数调用 this指向和普通函数一样

Student("张三",18); //打印 window

2.正常使用 this指向新创建的对象

var s1 = new Student("张三",18); //打印 Student {name: "张三", age: 18}

3.当作为构造函数时 返回值默认是new关键字创建的实例化对象 但是 如果手动添加了返回值 那么 如果是基本数据类型 就不会影响 如果是复杂数据类型 那么就会覆盖掉默认的返回值

function Student(name,age){
    this.name = name;
    this.age = age;
    console.log(this); //Student {name: "lili", age: 16}
    // return {
    //     name : '111111',
    //     age : 1111111
    // }
    return [12,13,15]
}
var s1 = new Student("lili",16);
console.log(s1); //[12, 13, 15]
console.log(s1.age); //undefined

6.总结

普通函数 ： this是在调用的时候确定 谁调用 this就指向谁

箭头函数 ：this是在声明的时候就已经确定 而且不会改变 this是继承自父级执行上下文的this