javascript - 为什么 this.key 在 JavaScript 中不能正常工作？

Question

let student = {
    

fname: "Carlos",
    lname: 'Dubón',
    sayHi(){
        alert(`Hi my name is ${this.fname}`);
    },
    sayBye: function() {
        alert(`Bye ${this.fname}`);
    },
    sayHiAgain: ()=> {
        alert(`Hi my name is ${this.fname}`);
    }
}

student.sayHiAgain();

我是 Javascript 中的 OOP 新手，我知道我编写方法的 3 种方式完全相同。 student.sayHi();工作并显示警报 =>“嗨，我的名字是 Carlos”
但是 student.sayHiAgain();显示警报 =>“嗨，我的名字未定义”
我错过了什么？

Answer 1

当使用箭头函数时，它使用词法作用域意味着它指的是它的当前作用域而不是更远的过去，即绑定(bind)到内部函数而不是对象本身。

An arrow function expression is a syntactically compact alternative toa regular function expression, although without its own bindings tothe this, arguments, super, or new.target keywords. Arrow functionexpressions are ill suited as methods, and they cannot be used asconstructors.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions