题讲this

参考
来源：https://www.bilibili.com/video/BV1sN411974w?p=2
细讲：this - JavaScript | MDN (mozilla.org)

1. 知识

谁调用我，我指向谁

在一般函数中：直接使用函数，this指向全局

function get(content) {
    console.log(content)
 }
get('Hello') // Hello
// 上面的写法是下面的语法糖:函数即对象，归属于全局对象window
get.call(window,'Hello') // Hello

函数作为对象属性被调用：对象使用函数，this指向对象

var person ={
    name: 'San',
    run: function (time) {
        console.log(`${this.name} is running,at least ${time}min`)
    }
}
person.run(30) // San is running,at least 30min
// 上面的写法是下面的语法糖：person对象
person.run.call(person,30) // San is running,at least 30min

箭头函数没有自己的this

• 箭头函数不会创建自己的this,它只会从自己的作用域链的上一层继承this

// 1
var x = 11；
var obj = {
    x: 22,
    say: ()=> {
        console.log(this.x) // 箭头函数作用域：obj的对象内；指向上一层：window
    }
}
obj.say();// 11
// 2
var obj = {
    birth: 1990,
    getAge: function () {
        var b = this.birth; // 1990
        var fn = () => new Date().getFullYear() - this.birth; // 箭头函数作用域：function () {}；指向上一层:正确获取到birth
    }
};
obj.getAge();

2. 题目

var name = 222
var a = {
    name: 111,
    say: function () {
        console.log(this.name)
    }
}

var fun = a.say
fun() // 输出1：fun.call(windows),指向window,222
a.say() // 输出2：a.say.call(a),指向a,111

var b = {
    name: 333,
    say: function (fun) {
        fun()
    }
}
b.say(a.say) // 输出3：fun.call(windows),指向window,222
b.say = a.say
/*
var b = {
    name: 333,
    say: function () {
        console.log(this.name)
    }
}
*/
b.say() // 输出4：b.say.call(b)指向b,333

3. 过程

执行见题目注释

4. 答案

222
111
222
333