js中的this

默认绑定

当函数直接使用不带任何修饰的函数引用进行调用时，则绑定到全局对象或 undefined（严格模式时）上

function foo() {    
  console.log(this.a);
}

var a = 2;
foo();//2

隐式绑定

隐式绑定规则会把函数调用中的 this 绑定到这个上下文对象

function foo() {    
  console.log(this.a);
}

var obj2 = {
    a: 42,
    foo: foo
};

var obj1 = {
    a: 2,
    obj2: obj2
}

obj1.obj2.foo();//42

注意：对象属性引用链中只有上一层或者说最后一层在调用位置中起作用

 隐式丢失

被隐式绑定的函数会丢失绑定对象，就是说会默认绑定，从而把 this 绑定到全局对象或 undefined 上

function foo() {    
  console.log(this.a);
}

var obj = {
  a: 42,
  foo: foo
};

var bar = obj.foo; // 函数别名
var a = "oops";

bar(); // "oops"

// 传入回调函数时
function foo() {    
  console.log(this.a);
}

function doFoo(fn) {
  // fn 其实引用的是 foo
  fn(); // <-- 调用位置
}

var obj = {
  a:42,
  foo: foo
};

var a = "oops";
doFoo(obj.foo);// oops

// setTimeout()也会丢失 this 绑定
function foo() {    
  console.log(this.a);
}

var obj = {
  a:42,
  foo: foo
};

var a = "oops";
setTimeout(obj.foo, 100);

回调函数丢失 this 绑定非常常见

 显式绑定

利用 call()，apply()

function foo() {    
  console.log(this.a);
}

var obj = {
  a:2
};

foo.call(obj); //2

区别在于第二个参数，call（）是依次输入参数，而apply（）是一个参数数组