JS this 关键字的指向

参考博客
参考博客2

this 指向问题

1. 在对象方法中，this 指向调用函数的对象实例。

2. 在浏览器中，单独的情况下（全局作用域），this 指向全局对象window。

3. 在普通函数中，this 指的是全局对象。（普通方法可以理解成全局对象的方法，包括对象方法中嵌套的函数）
   在严格模式下的 普通函数 中，this 是 undefined。

4. 构造函数中，this 则会指向构造的对象。new xxxx()

5. 在事件处理函数中，this 指向触发事件的目标对象（e.target）。

6. call() 和 apply() 方法可以将 this 引用到任何对象 （.bind()不会立即执行）
   .call() 和 .apply()可以调用本对象方法，但this指向作为参数的对象

7. 箭头函数没有this，会向外层寻找父执行上下文里面的this
   当父级为简单对象（非函数）时，是没有执行上下文的，会继续向上层寻找继承this。

总结：
1. this 肯定是指向对象的，可能情况不同，但本质上都是当前对象。
2. 只有函数中才会有 this 的概念

注：用对象的方法赋值给其他变量时，传递只是方法（函数）本身，因为等同于普通函数。

我们将window理解成最外层的对象，那么普通函数的 this 也是寻找其对象。

// 模拟流量器的全局对象
let window = {
    x: '阿巴阿巴', // 全局对象的属性
    func() {
        let x = 123
        // console.log(this) // window 对象
        obb = {
            x: 456,
            g_x: this.x, // 也在 func 函数下 即 window.x
            z: 255,
            y: {
                x: 333,
                // 普通函数
                add() {
                    console.log('this.x = ', this.x) // y.x
                    console.log('this.z = ', this.z) // y.z 'undefined'
                    console.log('this.z = ', obb.z) // obb.z
                },
                // 箭头函数
                obc: f = () => {
                    console.log('obc拥有func的this', this) // 此处 this 等同于 func 的 this，因为 y 是普通对象，没有上下文
                    let x = 111;
                    let obj = {
                        x: 22,
                        say: () => {
                            console.log('层层向上 x =', this.x);
                        }
                    }
                    obj.say();
                }
            }
        }
        obb.y.obc()
        console.log('全局x:', obb.g_x)
    }
}
// 普通函数注册在 window 对象下，在浏览器下可以省略 window
window.func()

非浏览器环境：

/**
 * 正常的全局操作
 */
// 定义一个全局变量
G_x = '全局'
function abc() {
    // console.log('this:', this); // 可以获得全局对象
    (() => {
        this.G_x = '变全局'
    })()
}
// console.log(G_x) // '全局'
abc()
// console.log(G_x) // '变全局'
/*--------------------*/
let _this = null;
(function temp() {
    _this = this
})()
// console.log('this:', this) // 不在函数中无法直接获取 this
// console.log('_this:', _this)