[JavaScript]this你掌握了吗？分享一下我“非凡”的理解

【版权声明】未经博主同意，谢绝转载！（请尊重原创，博主保留追究权）
https://www.cnblogs.com/cnb-yuchen/p/18277656
出自【进步*于辰的博客】

参考笔记二，P6.1；笔记三，P72、P73.1。

先言

我很早就知晓JS的这个知识点——this的重要性，并特意系统学习、理解并有所笔记，但限于平日用得少，对其的理解慢慢淡化。

前段时间打算复习一下，一翻阅笔记“懵逼”，因为我的笔记是经个人理解后“精简”的，若后来有所淡忘再去看必然难免一些地方不理解，无妨，再去系统学一遍。

你肯定会问：“你明知this这个知识点的重要性，平日怎么会少用，进而淡忘？” 有句话你肯定听过，“面试造航母，开发拧螺丝”。（PS：这次不是为了面试，而是出于工作需要，有必要巩固一些JS基础）

启发博文：《js中this究竟指向哪里？现在终于搞定了！》（转发）。

我觉得这位哥们总结得很全面，解决了我所有的疑惑。我也有所笔记，特作此文。当然，不是做一个“搬运工”（PS：那样没意义）。

前面我说过，我的笔记是经个人理解后“精简”的，故你可能不一定能理解它们（出于个人时间考虑，我暂不打算对它们进行举例说明和扩展）。如果你一脸懵逼，还是移步【启发博文】吧。

早期笔记

1：this指向类似引用，this.xx即访问调用它的对象的xx属性，此时this指向调用它的对象。（注：所谓“调用”，不是指仅“写出来”，而是“访问”）

2：当函数中有this时，this一定指向函数的上一级对象。访问变量时（this.xx），若函数中存在此变量声明（this.xx = xx），则访问该变量，否则访问函数的上一级对象的xx属性。此时，this指向函数的上一级对象，而不是函数。

3：this的指向在调用时确定，函数的确可以实例化，但本身不是对象，故this不会指向它。

4：函数可作为变量传递，但函数不是对象，故若要访问函数的局部变量，需实例化。

5：若函数的返回值是对象（对象或函数），则this指向该对象，否则指向此函数的实例（返回值无效）。特例：若函数返回undefined或null，尽管null也是对象，但this仍指向此函数实例（实例化会改变this指向）。

以上就是我早期学习this时所作的笔记，这样怎会让人不“懵逼”。如今看来，虽然有点“抽象”，但经我核对，这些笔记本身是无误的，正好应对this使用时诸多的“复杂”情况。所谓“存在即合理”，于是我也将它们“迁移”过来了。

如今笔记

1：JS规定：由于this一定指向对象，故即便this所指向的对象中不存在属性a，this.a返回的是undefined，而非报错。

2：对象定义中的this一定指向该对象，如：使用字面量定义对象的属性的属性值为函数引用，函数中的this。

3：this也应遵循“词法作用域”。

4：this指向调用者（对象）。若函数引用作为对象属性，如：字面量、构造函数（this.fun = fun），则函数内的this指向该对象；若函数调用语句作为对象属性，如：字面量、构造函数（this.fun = fun），则函数内的this指向全局对象。

5：假设对象obj1依赖obj2（字面量定义），调用obj1.obj2.fun()同样遵循 第4点，可理解为“就近原则”。

6：在全局作用域下定义的函数若在全局作用域下调用，函数内的this一定指向全局对象。有三种方法可改变this指向（显式绑定）：

1. fun.call(obj, arg1, ...)；
2. fun.apply(obj, [arg1, ...])；
3. fun.bind(obj, arg1, ...)。

其中，前2个在指定this指向的同时调用，而bind()只作相应绑定，并未调用，其返回作绑定后的“新函数”，故需再调用（newFun()）。

再调用时也可指定实参。若调用bind()时未指定全部实参，再指定的实参可作为“候补”，否则，再指定实参无效（不会覆盖）。

注意：

1. arg1, ...与[arg1, ...]是固定格式。其中，调用apply()时，即便只有一个形参，也必须是列表。
2. obj必须是对象才有效（改变this指向），若obj是函数，则this仍指向全局对象。

重申一遍：如果你仍然觉得一脸懵逼，还是移步【启发博文】吧。

本文完结。

上一篇：[JavaScript]作用域的“生产者”——词法作用域。