你不知道的JS（上卷）笔记——this全面解析总结

定义

个人理解：this 是一个记录上下文的对象

作用

通过它我们可以寻找程序运行时我们需要的某些上下文信息

更改this绑定的4种方式：

1. 默认绑定:

在严格模式下this默认绑定到undefined上，非严格模式绑定到全局对象上（node中绑定到模块上——一个空对象，不是绑定到global对象上）。看代码：

        (function f1() {
            console.log(this) //this默认绑定到全局对象中，浏览器中就是window对象
        })();

        (function() {
            'use strict';

            function f2() {
                console.log(this) //严格模式下，this绑定到undefined上
            }
            f2()
        })()

2. 常规绑定：

一般情况下，this指向调用它的对象。

3. 隐式绑定:

• 引用绑定

let obj1 = {
    name: 'obj1',
    f1
}

function f1() {
    console.log(this.name)
}


let fnobj1 = obj1.f1

fnobj1(); //这种通过引用对象的方式，只用看最终引用的对象，这里是f1。f1中的this在浏览器中指向window
obj1.f1();//按照一般的绑定规则，this绑定到了obj1

• 传参绑定

let obj1 = {
    name: 'obj1',
    f1
}

function f1() {
    console.log(this.name)
}

(function(fn) {
    fn();
})(obj1.f1)//通过传参的方式也是看最终引用的对象，这里是f1

4. 显示绑定（硬绑定）

• apply
• call
• bind
• 第三方API比如forEach
  ps: 如果apply和call以及bind的第一个参数是null或者undefined，则this默认绑定到全局对象

5. 通过关键字new

new的实现主要通过以下4部来完成

    function ClassObj(name) {
        this.name = name
   }
   let obj = {};  //创建一个空对象
    
    obj._proto__= ClassObj.prototype;//把该对象的原型对象指向构造函数
    
    ClassObj.call(obj, name);//通过硬绑定改变this指向
    
    return obj;//返回新的该对象

更改this绑定4种方式的优先级：

new 和 硬绑定的优先级>隐式绑定>默认绑定

箭头函数中的this指向：

箭头函数的this是在定义函数时绑定的，不是在执行过程中绑定的。简单的说，函数在定义时，this就继承了定义函数的对象。

global.name = 'global'
let obj2 = {
    name: 'wcx1',
    sayhello: () => {
        console.log(this)
    },
    sayhi: function () {
        console.log(this)
    },
    saygood: function () {
        (() => {
            console.log(this.name);
            (() => {
                console.log(this.name)
            })()
        })()
    }
}
obj2.sayhello()//浏览器中指向window
obj2.sayhi()//指向obj2
obj2.saygood()//层层继承指向obj2