一、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);
