默认绑定
JS中最常用的函数调用类型：独立函数调用。可将其看作无法应用其他规则时的默认规则。
function foo() {
console.log(this.a);
}
var a = 2;
foo(); // 2
- 声明在全局作用域中的变量就是全局对象的一个同名属性。
- 如果使用了严格模式，则不能将全局对象应用于默认绑定。如下：
function foo() {
'use strict';
console.log(this.a);
}
var a = 2;
foo(); // TypeError: this is undefined
隐式绑定
当函数引用有上下文对象时，隐式绑定规则会把函数中的this绑定到这个上下文对象。
function foo() {
console.log(this.a);
}
var obj2 = {
a: 42,
foo: foo
};
var obj1 = {
a: 2,
obj2: obj2
}
obj1.obj2.foo(); // 42
- 无论是直接在
obj2中定义还是先定义再添加为引用属性，这个函数严格来说都不属于obj2对象。 - 对象属性引用链中只有上一层或者说最后一层在调用位置中起作用。
隐式丢失
一个常见的this绑定问题就是被隐式绑定的函数会丢失绑定对象，从而应用默认绑定。
function foo() {
console.log(this.a);
}
var obj = {
a: 2,
foo: foo
};
var bar = obj.foo;
var a = 'global a';
bar(); // global a
虽然bar是obj.foo的一个引用，但实际上它引用的是foo函数本身，因此此时的bar()其实是一个不带任何修饰的函数调用，从而应用了默认绑定。
显式绑定
可以直接指定this的绑定对象，因此称之为显式绑定。
call(...) / apply(...)
function foo() {
console.log(this.a);
}
var obj = {
a: 2
};
foo.call(obj); / /2
- 通过
foo.call(...)，我们可以在调用foo时强制把它的this绑定到obj上。 - 如果传入一个原始值（如数字、字符串）当作
this绑定的对象，这个原始值会被转换成它的对象形式（即new String(...),new Number(...)等）。这通常被称为“装箱”。 - 至此，显式绑定仍无法解决丢失绑定的问题。
硬绑定
硬绑定是显式绑定的一个变种，可以解决绑定丢失。
unction 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
- 在函数
bar中，我们将foo的this强制绑定到了obj上，无论之后如何调用bar，总会手动在obj上调用foo，无法再改变它的this。 - 这种绑定是一种显式的强制绑定，因此称为硬绑定。
-
bind()是ES5提供的实现硬绑定的内置方法。 - 许多API或内置函数都有一个可选参数
context，其作用和bind一样，都是确保你的回调函数使用指定的this。
new绑定
在JS中，构造函数只是一些使用new操作符时被调用的函数。它们并不属于某个类，也不会实例化一个类。只是被new操作符调用的普通函数。
function foo (a) {
this.a = a;
}
var bar = new foo(2);
console.log(bar.a); // 2
console.log(bar); // foo {a: 2}
使用new调用foo时，会构造一个新对象并把它绑定到foo调用中的this上。new是最后一种可以影响函数调用时this绑定行为的方法，我们称之为new绑定。
Tips
使用new调用函数时，会自动执行如下操作：
- 创建（或者说构造）一个全新的对象
- 这个新对象会被执行
[[Prototype]]连接 - 这个新对象会绑定到函数调用的
this - 如果函数没有返回其他对象，那么
new表达式中的函数调用会自动返回这个新对象
