Micro-channel demo aircraft war games code analysis 2 (databus.js)

Micro-channel demo aircraft war games code analysis 2 (databus.js)

Micro-channel demo aircraft war games code analysis 1 (main.js)

This blog will use the code line by line analysis to explain the demo, this article applies to other familiar high-level language, yet in-depth understanding of js students, bloggers will try not understand all the parts encountered clearly marked, if incorrect or unclear, please correct me in the comments

Code for this article acquisition by the micro-channel game automatically generated demo aircraft in World War II

databus.js

Code:

import Pool from './base/pool'

let instance

/**
 * 全局状态管理器
 */
export default class DataBus {
  constructor() {
    if ( instance )
      return instance

    instance = this

    this.pool = new Pool()

    this.reset()
  }

  reset() {
    this.frame      = 0
    this.score      = 0
    this.bullets    = []
    this.enemys     = []
    this.animations = []
    this.gameOver   = false
  }

  /**
   * 回收敌人，进入对象池
   * 此后不进入帧循环
   */
  removeEnemey(enemy) {
    let temp = this.enemys.shift()

    temp.visible = false

    this.pool.recover('enemy', enemy)
  }

  /**
   * 回收子弹，进入对象池
   * 此后不进入帧循环
   */
  removeBullets(bullet) {
    let temp = this.bullets.shift()

    temp.visible = false

    this.pool.recover('bullet', bullet)
  }
}

instance

• This object is used to carry only the databus class file, single-mode embodiment
• Singleton pattern is a design pattern, to ensure that only a global class objects, this will ensure the consistency of the global data in the demo

constructor

Constructor

• If an existing instance is not empty, then return instance
  • This is to achieve a singleton to ensure that no matter how many times can only generate a new target
• If not empty, the instance is set to itself, and following an initialization operation
  • Create an object pool pool
    • Object pooling technique is generated by the object temporarily stored in the pool, when needed objects in the pool to see if there is excess objects, if less then generate the object, but not really destroyed when the object is destroyed, but added the object pool
  • Reset all content, set to null

removeEnemey(enemy)

Remove an enemy target (enemy)

• Get the first element of the array from enemys
  • js shift method is to remove and return the first element of the method
• Set its invisible
• Into a pool called enemy of

removeBullet(bullet)

Remove one bullet

A function the same operation as above

pool.js

Achieve a function for the target pool

代码：

const __ = {
  poolDic: Symbol('poolDic')
}

/**
 * 简易的对象池实现
 * 用于对象的存贮和重复使用
 * 可以有效减少对象创建开销和避免频繁的垃圾回收
 * 提高游戏性能
 */
export default class Pool {
  constructor() {
    this[__.poolDic] = {}
  }

  /**
   * 根据对象标识符
   * 获取对应的对象池
   */
  getPoolBySign(name) {
    return this[__.poolDic][name] || ( this[__.poolDic][name] = [] )
  }

  /**
   * 根据传入的对象标识符，查询对象池
   * 对象池为空创建新的类，否则从对象池中取
   */
  getItemByClass(name, className) {
    let pool = this.getPoolBySign(name)

    let result = (  pool.length
                  ? pool.shift()
                  : new className()  )

    return result
  }

  /**
   * 将对象回收到对象池
   * 方便后续继续使用
   */
  recover(name, instance) {
    this.getPoolBySign(name).push(instance)
  }
}

const __

Magic used to prevent occurrence of the string constants list

• Symbol
  • Js string repeatedly used to get some values ​​or objects called magic string, if the string too much, you can normally use, but if you need to modify, you need to edit multiple strings, it is not conducive to the maintenance
  • To solve this problem, ES6 introduces a new data type Symbol, is used to store the string type, but after only need to use the string to use the constant to obtain
  • symbol type similar to the type of string, the new command can not be used, nor add attributes
• Here declares an object name poolDic, a dictionary for storing a plurality of objects pools

constructor()

• Create an empty poolDic

getPoolBySign(name)

• Obtain the corresponding object name based on the incoming cell, if there is a new generation to an array to a target cell

getItemByClass(name, className)

Get Object

• Obtain the corresponding object pool
• Determining whether the target cell is empty, if not empty, return the first element, and is removed from the pool
• If not empty, then generate a new object with the incoming class name

recover(name, instance)

Recycling objects

• Gets the object to which the pool of push elements
  • js a push operation in the array for array element into which