我们可以在 class 中直接添加嵌套的 objects 吗？正确的语法是什么？

Question

我正在进入 Web 开发领域并在几天前开始学习 JavaScript。在这段代码中，我试图创建一个具有能力（包括炮弹）的 'player' class。能力将是玩家 class 中的嵌套 object。 Cannonball 将是 object 技能的嵌套 object。当我尝试创建一个播放器时，我收到语法错误 'abilities: {' 对不起，如果我完全破坏了所有内容的标题。总的来说，我只有几天的时间来编写代码！

class player {
  constructor(name,phrase) {
    this._name = name;
    this._catchPhrase = phrase;
  }
  get name() {
    return this._name;
  }
  abilities: {
    cannonball: {
      damage: 20;
    }
  }
}

Answer 1

经过一些实验，我发现这个语法有效！如果可能的话，有人可以批评这个吗？基本上这个 class 应该包含名称、流行语、两个能力（包含伤害和 currAmount 的不同对象）！

谢谢大家！

class player {
  constructor(name,phrase) {
    this._name = name;
    this._catchPhrase = phrase;
    this._abilities = {
      _cannonball: {
        _damage: 20,
        _currAmount: 3,
      },
      _arrows: {
        _damage: 10,
        _currAmount: 10,
      }
    }
  }
}

Answer 2

您可以使您的能力属性发挥作用，如下所示。详情见代码中的注释。
（对于所有与网络相关的思考，尽早并经常参考 MDN。）

class Player { // Uses initial capital letter by convention

  constructor(name, phrase) {
    this._name = name;
    this._catchPhrase = phrase;

    // Adds the `abilities` property to all instances of Player
    this.abilities = {
      // abilities is an object with a cannonball property
      cannonball: {
        // cannonball is an object with a damage property
        damage: 20 // No semicolon in object literal
      }
    };
  }

  get name() {
    return this._name;
  }
}
// Makes a new player, and shows that her abilities include `cannonball`
const player = new Player("Grandma", "Hold my beer!");
for(let prop of Object.keys(player.abilities)){  
  console.log(player.abilities[prop]);
}

Answer 3

Java脚本没有像 class player { abilities: {...} }.

这样的语法

More information about javascript classes.

您可以将 abilities 对象绑定到构造器上的播放器实例，或者改用 getter。

// example
class player {
    constructor(name, phrase) {
        this._name = name;
        this._catchPhrase = phrase;
        // your abilities object
        this.abilities = {
            cannonball: {
                damage: 20;
            }
        }
    }

    // or use getter
    get abilities() {
        return {
            cannonball: {
                damage: 20;
            }
        }
    }
}

如果你真的需要像 Java 这样的 nested-class 解决方案，请参阅 Lorenzo Polidori 对此 question 的回答。

Answer 4

这是我问这个问题的最后一个迷你项目。我目前处于学习 Javascript 的第 4 天，这是我学到的最好的。再次感谢您！

class player {
  constructor(name,phrase) {
    this._name = name;
    this._catchPhrase = phrase;
    this._health = 100;
    this._abilities = {
        _cannonball: {
          _damage: 20,
          _currAmount: 3,
        },
        _arrows: {
          _damage: 10,
          _currAmount: 10,
        },
    }
  }
  set lowerCannon(lowerBy) {
    this._abilities._cannonball._currAmount -= lowerBy;
  }
  set lowerArrows(lowerBy) {
    this._abilities._arrows._currAmount -= lowerBy;
  }
  set lowerHealth(lowerBy) {
    this._health -= lowerBy;
    if (this._health <= 0) {
      this._health = 0;
    }
  }
}

//shooting functions that lower current amount
var shootCannon = (playerTurn,playerHit) => {
  if (playerTurn._health === 0 || playerHit._health === 0)
  {
    //console.log('Game has already ended!')
  }
  if (playerTurn._abilities._cannonball._currAmount === 0) {
    console.log(`${playerTurn._name} is out of Cannonballs!`)
    shootArrows(playerTurn,playerHit);
  }
  else {
  playerTurn.lowerCannon = '1';
  playerHit.lowerHealth = playerTurn._abilities._cannonball._damage;
  console.log(`${playerTurn._name} has fired a cannonball dealing ${playerTurn._abilities._cannonball._damage} damage!...`);
  console.log()
  console.log(`${playerHit._name}'s health is now at ${playerHit._health}!`);
  console.log()
  }
}
var shootArrows = (playerTurn,playerHit) => {
  if (playerTurn._health === 0 || playerHit._health === 0)
  {
    //console.log('Game has already ended!')
  }
    if (playerTurn._abilities._arrows._currAmount === 0) {
    console.log(`${playerTurn._name} is out of arrows!`)
    shootCannonball(playerTurn,playerHit);
  }
  else {
  playerTurn.lowerArrows = '1';
  playerHit.lowerHealth = playerTurn._abilities._arrows._damage;
  console.log(`${playerTurn._name} has fired arrows! dealing ${playerTurn._abilities._arrows._damage} damage!...`);
  console.log()
  console.log(`${playerHit._name}'s health is now at ${playerHit._health}!`);
  console.log()
  }
}

//Make computer fight each other functions
var randomAttack = (playerTurn,playerHit) =>{
  index = Math.floor(Math.random()*2);
  if (index === 1) {
    return shootArrows(playerTurn,playerHit);
  }
  else {
    return shootCannon(playerTurn,playerHit);
  }
}
var botMatch = (playerTurn,playerHit) => {
  if (playerTurn._health <= 0 || playerHit._health <= 0) {
    if (playerTurn._health > playerHit._health) {
      console.log(`${playerTurn._name} has won!`)
    }
    if (playerTurn._health < playerHit._health) {
      console.log(`${playerHit._name} has won!`)
    }
    console.log('Game Over!')
  }
  else {
    randomAttack(playerTurn,playerHit);
    randomAttack(playerHit,playerTurn);
    botMatch(playerTurn,playerHit);
  }
}

const player1 = new player('Juan','Let\'s Go!');
const player2 = new player('Jaileth','Beep Beep');

botMatch(player1,player2);

我们可以在 class 中直接添加嵌套的 objects 吗？正确的语法是什么？

Can we add nested objects directly inside a class? What would be the correct syntax?

javascript

syntax

nested

object