为什么 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(); 工作并显示警报 =>“嗨，我的名字是卡洛斯”

但student.sayHiAgain();显示警报 =>“嗨，我的名字未定义”

我错过了什么？

Answer 1

当使用箭头函数时，它使用词法作用域，这意味着它指的是当前作用域，并且不再超出该作用域，即绑定到内部函数而不是对象本身。

箭头函数表达式是正则函数表达式的语法紧凑替代方案，尽管它没有自己的与 this、arguments、super 或 new.target 关键字的绑定。箭头函数表达式不适合用作方法，并且不能用作构造函数。

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