今天，我们进行对this知识点的复习，每一次都是温故知新的过程。

这次对于this的学习是基于《你所不知道的JavaScript》这本书，算是对于书中的知识做一个总结。

如果你有兴趣，也可以通过下面的连接精选购买此书，也算是对我和对作者的一种支持，在此，非常感谢。

首先，要明确的是一般情况下，this不是函数被定义时绑定，而是函数被调用时被绑定  

那么函数中的this有四种绑定方式：

1、默认绑定

直接调用函数，使用不带任何修饰的函数进行调用，只能使用默认绑定，无法应用其它规则，代码如下：

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

2、隐式绑定

函数被调用时有上下文对象，那么this会绑定这个上下文对象，代码如下：

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

其实不能讲foo这个函数属于obj对象，但是foo函数被调用时的落脚点的确是指向obj对象，当函数引用有上下文对象时，隐式绑定就会把函数调用中的this绑定到这个上下文对象；

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

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

隐式丢失

对于应用隐式绑定方式绑定this经常导致的一个情况是隐式丢失this

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

针对这种情况，虽然bar是obj.foo的一个引用，但是实际上它引用的是foo函数本身，此时bar（）其实是一个不带任何修饰的函数调用，应用了默认绑定；

3、硬绑定

使用call，apply或者bind，在调用函数的时候直接指定上下文对象，那么函数中的this会绑定到传入的对象，代码如下：

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

4、new绑定

使用new调用某个构造函数，代码如下：

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

学习更多技能

请点击下方公众号