一、this

1、说明

this的指向在函数定义的时候是确定不了的，只有函数执行的时候才能确定this到底指向谁，实际上this的最终指向的是那个调用它的对象

2、举例

var test = {
    a : 10,
    b : {
        a : 12,
        fn : function(){
            console.log(this.a); //12
        }
    }
}
test.b.fn();

3、解读

这里同样也是对象test点出来的，但是同样this并没有执行它，那你肯定会说我一开始说的那些不就都是错误的吗？其实也不是，只是一开始说的不准确

• 情况1：如果一个函数中有this，但是它没有被上一级的对象所调用，那么this指向的就是window，这里需要说明的是在js的严格版中this指向的不是window（undefined），但是我们这里不探讨严格版的问题。

• 情况2：如果一个函数中有this，这个函数有被上一级的对象所调用，那么this指向的就是上一级的对象。

• 情况3：如果一个函数中有this，这个函数中包含多个对象，尽管这个函数是被最外层的对象所调用，this指向的也只是它上一级的对象。

4、例题解析

var test = {
    a:10,
    b:{
        a:12,
        fn:function(){
            console.log(this.a); //undefined
            console.log(this); //window
        }
    }
}
var j = test.b.fn;
j();

this永远指向的是最后调用它的对象，也就是看它执行的时候是谁调用的，例子4中虽然函数fn是被对象b所引用，但是在将fn赋值给变量j的时候并没有执行所以最终指向的是window。

5、当this遇到return

function fn()  
{  
    this.user = '蜡笔小清新';  
    return function(){};
}
var a = new fn;  
console.log(a.user); //undefined

function fn()  
{  
    this.user = '蜡笔小清新';  
    return 1;
}
var a = new fn;  
console.log(a.user); //蜡笔小清新

如果返回值是一个对象（除了null），那么this指向的就是那个返回的对象，如果返回值不是一个对象那么this还是指向函数的实例。

二、call/apply

1、说明

• 两者都可以改变this指向

var a = {
    user:"蜡笔小清新",
    fn:function(){
        console.log(this.user); //蜡笔小清新
    }
}
var b = a.fn;
b.call(a);

• 任何一个方法都可以.call，其实方法的执行就是方法.call 执行，例如test() 就相当于 test.call()

function test() {
console.log(’蜡笔小清新‘); //蜡笔小清新
}
test.call();

2、用法

function Person(name,age) {
this.name = name;
this.age = age; }
var obj = {};
Person.call(obj);

• call 后边的括号里是可以传东西的，比如传一个 obj 进去，他就会引导着 Person 发生 很大的变化。如果在 Person 底下 new 的话，this 就代表了构造函数所 产生的对象，我们假如说没有new的话，this默认是指向window的，但是我们在call 里传 obj 了，那么这个 this 就不是默认的了，就变成 obj 了，就是 call 里边传谁进 去，this 就是谁。等于说里边现在执行的时候就是 obj.name = name，obj.age = age， 即使是这样，依然可以传参:
  Person.call(obj,'小万',20);
  现在访问 obj 就得到{name: "小万", age: 20},因为 call 括号里的第一位会改变 this 指向，第一位以后都会当成正常的实参传到形参里边去（null就指向window），所以这里边第二个实参对应 的是函数执行的第一位形参，第三个实参对应的是函数执行的第二位形参。所以 call 的根本原因是改变 this 指向，借用 Person 的执行封装了 obj，借用你的方法来实现我 的功能。

3、示例

function Wheel(wheelSize, style) {
    this.wheelSize = wheelSize;
    this.style = style;
}

function Sit(c, sitColor) {
    this.c = c;
    this.sitColor = sitColor;
}

function Model(height, width, len) {
    this.height = height;
    this.width = width;
    this.len = len;
}

function Car(wheelSize, style, c, sitColor, height, width, len) {
    Wheel.call(this, wheelSize, style);
    Sit.call(this, c, sitColor);
    Model.call(this, height, width, len);
}
var car = new Car(100, "魂动之恶魔之眼", "织物", "white", 1800, 1900, 4900);

4、apply

• call 和 apply 基本上是一样的，只是写法不一样，call 需要把实参一个个传进去，但 是 apply 只能传一个值 arguments，即实参列表

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

function Student(name, age, sex, tel, grade) {
    Person.apply(this, [name, age, sex]);
    this.tel = tel;
    this.grade = grade;
}
var student = new Student('小万', 20, 'male', 187, 2017);

三、bind

• bind和call、apply方法不同，实际上bind方法返回的是一个修改过后的函数。

var a = {
    user:"蜡笔小清新",
    fn:function(){
        console.log(this.user); //蜡笔小清新
    }
}
var b = a.fn;
var c = b.bind(a);
c();

• 同样bind也可以有多个参数，并且参数可以执行的时候再次添加，但是要注意的是，参数是按照形参的顺序进行的。

var a = {
    user:"蜡笔小清新",
    fn:function(e,d,f){
        console.log(this.user); //蜡笔小清新
        console.log(e,d,f); //10 1 2
    }
}
var b = a.fn;
var c = b.bind(a,10);
c(1,2);