javascript - 为什么类实例方法在调用后导致未定义。超时功能是否正确？

Question

aeri.attack/aeri.magicAttack 导致 attack() 函数。但是，如果我尝试调用该函数，它会导致未定义。为什么。

我尝试创建一个 Character 实例来查看它是否只是子类，但事实并非如此。

PS，如果有人能告诉我我是否正确执行了 setTimeout 函数，那就太棒了，我会永远爱你。

PS PS 我无法测试超时方法是否有效，因为我的方法都无效。

class Character {
    constructor(name, weapon) {
        this.name = name;
        this.weapon = weapon;
    }

    attack(){
        this.name + ' attacks with ' + this.weapon;
    }
}

class Elf extends Character {
    constructor(name, weapon, type) {
        super(name, weapon);
        this.type = type;
    }

    magicAttack() {
        this.name + ' chants ';
        setTimeout(function(){this.type; }, 3000);


    }
}

const aeri = new Elf("Aeri", "bow", "air")
const bob = new Character("Bob", "yawn")

Answer 1

原始帖子中的代码没有执行 OP 期望的操作有几个原因。

class Character {
    constructor(name, weapon) {
        this.name = name;
        this.weapon = weapon;
    }

    attack(){
        this.name + ' attacks with ' + this.weapon;  //  (1)
    }
}

class Elf extends Character {
    constructor(name, weapon, type) {
        super(name, weapon);
        this.type = type;
    }

    magicAttack() {
        this.name + ' chants ';                      //  (2)
        setTimeout(function(){this.type; }, 3000);   //  (3)


    }
}

const aeri = new Elf("Aeri", "bow", "air")
const bob = new Character("Bob", "yawn")

(1) attack() 方法缺少一个return 语句

(2) this.name + ' chants '; 语句没有做任何事情，因为连接的结果没有分配给变量或传递给方法，所以它被简单地丢弃了。

(3) 传递给setTimeout 的匿名函数引用this.type，但给定how this works in JavaScript , type 在此上下文中未定义(因为 this 实际上是匿名函数本身)。

要查看调用该方法的结果，需要对原始代码示例应用以下更改:

class Character {
    constructor(name, weapon) {
        this.name = name;
        this.weapon = weapon;
    }

    attack(){
        return this.name + ' attacks with ' + this.weapon;    //  (1)
    }
}

class Elf extends Character {
    constructor(name, weapon, type) {
        super(name, weapon);
        this.type = type;
    }

    magicAttack() {
        const chant = this.name + ' chants ';                  //  (2)
        setTimeout(function(){ console.log(chant); }, 3000);   //  (3)

    }
}

const aeri = new Elf("Aeri", "bow", "air")
const bob = new Character("Bob", "yawn")

aeri.magickAttack();

希望这对您有所帮助!

一月