ES2015入门系列10-类 classes

2024年5月1日 117次阅读 来源: chekun

OK, 我们继续，此次来聊聊类。

内有 Jon Snow大战异鬼, ?

熟习后端的朋友们对类一定都不生疏，如下面一段PHP的代码:

class Human
{

  protected $name;

  public function __construct($name)
  {
    $this->name = $name;
  }

  public function introduce()
  {
    echo '你好，我叫 ' . $this->name . PHP_EOL;
  }

}
$jack = new Human('Jack');
$jack->introduce();

上面的代码，我们创建了一个叫Human的类，初始化的时刻传入名字，另有一个毛遂自荐的要领。

一样的功用到了JS的天下呢? 且看下面的代码(ES5):

var Human = function(name) {
  this.name = name;
};

Human.prototype.introduce = function() {
  console.log('你好，我叫 ' + this.name);
};

var jack = new Human('Jack');
jack.introduce();

对了，你没有看错，在JS的天下中，我们就是这么来完成类的开辟的, 总觉得那里不舒服对吧?

到了ES2015(ES6), 事变就变得美好了，一同来看看下面的代码：

class Human {

  constructor(name) {
    this.name = name;
  }

  introduce() {
    console.log(`你好，我是 ${this.name}`);
  }

}

let jack = new Human('Jack');
jack.introduce();

终究变得一般一些了，泪奔。。。

人人请记着，这只是语法糖，在这背地的完成依然是我们ES5中展现的代码，然则，我们用着爽就好，哈哈哈！！！

有了class关键字，天经地义就有extends喽，立时尝尝：

class Man extends Human {

  construtor(name) {
    super(name);
    this.gender = 'male';
  }

}

new Man('Jon').introduce();

继续泪奔，写法上不必为了完成继续，种种操纵prototype了。

这里还要特别讲一下静态要领:

class Tree {

  static new() {
    return new Tree();
  }

}

let tree1 = new Tree(); // Tree Object
let tree2 = Tree.new(); // Tree Object
tree1.new(); // TypeError: tree1.new is not a function

能够看到，静态要领只能在类中挪用，而不能被类实例挪用。

为了更好的体验JS面向对象开辟，下面我们来实战一下，来写一个简朴的自动MUD游戏，故事的场景是Jon Snow大战异鬼，?。

  • 主角Jon Snow将大战多少回合的异鬼，并终究和Night King决斗！

  • Jon Snow每打败一个异鬼将吞噬该异鬼的品级到本身身上

  • Jon Snow有必杀进击

剖析一下：

  • 不管是Jon Snow, 异鬼和Night King, 关于游戏来讲都是角色，所以我们应当有个角色基类。

    • 有称号，品级，血量等基本属性

    • 有进击，晋级，蒙受危险等要领

  • Jon Snow 应当继续 角色基类，并具有必杀进击的要领

  • 须要有个游戏天下, 有场景，并能够掌握游戏最先。

OK，编写代码：

class Role { //角色基类

  constructor(name, level = 1, health = 100) {
      this.name = name;
      this.level = level;
      this.health = health;
  }

  isDead() { //推断角色是不是殒命
    return this.health <= 0;
  }

  levelUp(level = 1) { //晋级
    this.level += level;
  }

  damage(power) { //遭到危险
    this.health = this.health - power;
  }

  attack(role) { //进击
    this.strike(role);
  }

  strike(role) { //普通进击
    let power = parseInt(Math.random() * 20 * this.level / 10);
    role.damage(power);
    console.log(`[${this.name}]进击了[${role.name}], 造成了[${power}]点危险`);
  }

}

class Hero extends Role {

    attack(role) { //进击，有几率是用必杀进击
        if (! this.isCriticalStrike()) {
            return this.criticalStrike(role);
        }

        return this.strike(role);
    }

    criticalStrike(role) { //必杀进击
        let power = parseInt(200 * Math.random() + 50);
        role.damage(power);
        console.log(`[${this.name}]运用必杀进击了[${role.name}], 造成了[${power}]点危险`);
    }

    isCriticalStrike() {
        return Math.random() > 0.70;
    }

}

class Monster extends Role {

}

class Game { //游戏天下

  constructor() {
    this.name = "权益的游戏";
    this.hero = new Hero('Jon Snow', 10); // 初始化好汉Jon Snow
    this.monsters = [ //怪物鸠合，模仿简朴的游戏关卡。
      new Monster('异鬼 01', 1, 10),
      new Monster('异鬼 02', 3, 30),
      new Monster('异鬼 03', 5, 50),
      new Monster('异鬼 04', 10, 100),
      new Monster('异鬼 05', 15, 150),
      new Monster('异鬼 06', 20, 200),
      new Monster('Night King', 50, 500)
    ];
    this.level = 0; // 游戏当前关卡纪录
    console.log(`你在[${this.name}]中饰演[${this.hero.name}], 征程行将最先...`);
  }

  play() { // 游戏最先
    while (this.level < this.monsters.length && ! this.hero.isDead()) {
      let monster = this.monsters[this.level];
      console.log(`关卡[${this.level + 1}] 你遇到了[${monster.name}], 进入战役:`);
      let offensive = this.hero;
      let defensive = monster;
      while (! this.hero.isDead() && ! monster.isDead()) {
        offensive.attack(defensive);
        let middleman = offensive;
        offensive = defensive;
        defensive = middleman;
      }
      if (this.hero.isDead()) {
        console.log(`你被[${monster.name}]打败了, 游戏完毕!`);
        break;
      }
      if (monster.isDead()) {
        console.log(`你打败了[${monster.name}] 品级提拔:[${monster.level}]`);
        this.hero.levelUp(monster.level);
        this.level ++;
      }
    }
    if (this.level === this.monsters.length) {
        console.log(`祝贺你通关游戏!`);
    }
  }

}

let game = new Game();
game.play();

实行一下，能够获得：

你在[权益的游戏]中饰演[Jon Snow], 征程行将最先...
关卡[1] 你遇到了[异鬼 01], 进入战役:
[Jon Snow]运用必杀进击了[异鬼 01], 造成了[114]点危险
你打败了[异鬼 01] 品级提拔:[1]
关卡[2] 你遇到了[异鬼 02], 进入战役:
[Jon Snow]运用必杀进击了[异鬼 02], 造成了[140]点危险
你打败了[异鬼 02] 品级提拔:[3]
关卡[3] 你遇到了[异鬼 03], 进入战役:
[Jon Snow]运用必杀进击了[异鬼 03], 造成了[69]点危险
你打败了[异鬼 03] 品级提拔:[5]
关卡[4] 你遇到了[异鬼 04], 进入战役:
[Jon Snow]运用必杀进击了[异鬼 04], 造成了[169]点危险
你打败了[异鬼 04] 品级提拔:[10]
关卡[5] 你遇到了[异鬼 05], 进入战役:
[Jon Snow]进击了[异鬼 05], 造成了[41]点危险
[异鬼 05]进击了[Jon Snow], 造成了[19]点危险
[Jon Snow]进击了[异鬼 05], 造成了[21]点危险
[异鬼 05]进击了[Jon Snow], 造成了[3]点危险
[Jon Snow]运用必杀进击了[异鬼 05], 造成了[223]点危险
你打败了[异鬼 05] 品级提拔:[15]
关卡[6] 你遇到了[异鬼 06], 进入战役:
[Jon Snow]运用必杀进击了[异鬼 06], 造成了[77]点危险
[异鬼 06]进击了[Jon Snow], 造成了[23]点危险
[Jon Snow]运用必杀进击了[异鬼 06], 造成了[221]点危险
你打败了[异鬼 06] 品级提拔:[20]
关卡[7] 你遇到了[Night King], 进入战役:
[Jon Snow]运用必杀进击了[Night King], 造成了[155]点危险
[Night King]进击了[Jon Snow], 造成了[88]点危险
你被[Night King]打败了, 游戏完毕!

人人能够调调参数，虐一虐大Boss吧，哈哈哈~~~~

    原文作者：chekun
    原文地址: https://segmentfault.com/a/1190000009992717
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞