微信小游戏_China_Fighting——npc类（enemy、mask、sars）

目录

微信小游戏_China_Fighting——前言

微信小游戏_China_Fighting——基础支撑类（sprite、animation、pool）

微信小游戏_China_Fighting——npc类（enemy、mask、sars）

微信小游戏_China_Fighting——player类（hero、button）

微信小游戏_China_Fighting——runtime类（background、fstart1、fstart2、gameinfo、music）

微信小游戏_China_Fighting——lib类（symbol、weapp-adapter）及databus

微信小游戏_China_Fighting——main.js及index.js

微信小游戏_China_Fighting——game.js、game.json、project.config.json

微信小游戏_China_Fighting——后记

正文

    本文主要讲解enemy.js、mask.js、sars.js的内容。
    由于将整个js全部粘贴到博文里过于占位置，只对于一些关键部分以及该js代码实现的功能进行讲解。若想获取整个js文件，可以去目录–>前言–>资源链接里下载，内含超详细注释。

    三个类其实大致相同，只是在游戏里的含义不同。

1. sars 代表新型冠状病毒，一旦触碰则游戏结束。
2. enemy代表障碍物，触碰到会扣除5分的成绩。
3. mask代表口罩，触碰到会增加10分的成绩。

    所以总体实现逻辑都是相同的，都继承了sprite类。如果小伙伴想要在道具被触碰后有相应的动画，可以选择继承anmation类。只需要多初始化一下每一帧的图片即可。

1.三个类总体结构

• 有屏幕宽高常量： screenWidth 、screenHeight。
• 自定义的三条道路的位置常量： LEFT_X、MID_X、RIGHT_X。
• 以及每一个类的图像以及宽高常量（以sars举例）：
  SARS_IMG_SRC 、SARS_WIDTH、SARS_HEIGHT。
• 调用继承的构造函数（以sars举例）：

  constructor() {
    super(SARS_IMG_SRC, SARS_WIDTH, SARS_HEIGHT)
  }

• 自定义的初始化速度及位置函数 init():这也是三个类唯一不同的地方。
• update更新函数（以sars举例）：

  update() {
    this.y += this[__.speed]

    // 超出屏幕外 对象回收
    if (this.y > window.innerHeight + this.height)
      databus.removeSarss(this)
  }

    在每一帧更新sars的y坐标。更新方式是加上自己的速度，当渲染的时候就像是sars以自己的speed向下移动。如果超出了屏幕，则进行对象的回收，回收至数据总线里对应的对象池里。

2.三个类的不同点

    三个类唯一的不同点就是init函数。
    本游戏里的逻辑：每一次迎来的三个道具中优先级：sars>enemy>mask。主要是为了增加些游戏难度，gameover的sars每次都要有，扣分的enemy少一些，加分的mask更为少一些。
    所以在初始化位置的时候，优先生成sars对象，其次enemy，最后mask。只有在init_sars时是不需要考虑其他道具的位置的。生成enemy的时候需要考虑纵坐标相同的sars的位置，如果随机出来的位置和已有的sars相同，则当前生成的enemy就不可见，在屏幕上就不会呈现enemy。mask的产生规则同enemy，只不过在生成时要同时考虑sars和enemy。

若有错误或者不解，欢迎评论区留言！