Day34 this 绑定

默认绑定

• 在无法应用其他规则时的默认规则，默认为全局对象window

function foo() {
  console.log( this.a );
}
var a = 2;
foo(); // 2

隐式绑定

• 取决于调用位置的上下文对象

function foo() {
  console.log( this.a );
}
var obj = {
  a: 2,
  foo: foo
};
obj.foo(); // 2

• 对象属性引用链中只有最顶层或者说最后一层会影响调用位置

function foo() {
  console.log( this.a );
}
var obj2 = {
  a: 42,
  foo: foo
};
var obj1 = {
  a: 2,
  obj2: obj2
};
obj1.obj2.foo(); // 42

• 参数传递也是一种隐式赋值

function foo() {
  console.log( this.a );
}
function doFoo(fn) {
  // fn 其实引用的是 foo
  fn(); // <-- 调用位置！
}
var obj = {
  a: 2,
  foo: foo
};
var a = "oops, global"; // a 是全局对象的属性
doFoo( obj.foo ); // "oops, global"

显式绑定

• call(..) 和 apply(..) 方法

function foo() {
  console.log( this.a );
}
var obj = {
  a:2
};
foo.call( obj ); // 2

• 硬绑定

function foo() {
  console.log( this.a );
}
var obj = {
  a:2
};
var bar = function() {
  foo.call( obj );
};
bar(); // 2
setTimeout( bar, 100 ); // 2
// 硬绑定的 bar 不可能再修改它的 this
bar.call( window ); // 2

new绑定

使用 new 来调用函数，或者说发生构造函数调用时，会自动执行下面的操作。

1. 创建（或者说构造）一个全新的对象。
2. 这个新对象会被执行 [[ 原型 ]] 连接。
3. 这个新对象会绑定到函数调用的 this。
4. 如果函数没有返回其他对象，那么 new 表达式中的函数调用会自动返回这个新对象

function foo(a) {
  this.a = a;
}
var bar = new foo(2);
console.log( bar.a ); // 2

优先级

显式>new>隐式>默认

Tips

• DMZ 对象(demilitarized zone，非军事区)
  Object.create(null)比{}更空