Skip to content

Styx11/2048

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

44 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

2048

仿制的2048,欢迎Android/iOS端的同学Fork

你可以👉点此试玩

以下API可以帮您快速了解我的编程思路

Grid

Gird栅格对象是游戏的核心部分,它直接作为用户与页面交互的渠道。我们并不直接频繁地操作DOM对象,而是通过栅格系统操作、记录每个单元格的位置信息与相对位置。

构造函数

Grid(size)


  • 参数:{Number} size 栅格大小
  • 创建一个size大小的(待定)Grid对象

属性

score


  • 类型:Number,
  • 默认值:0
  • 描述:记录每次单元格移动时获得的分数

size


  • 类型:Number,
  • 默认值:0
  • 描述:栅格尺寸

cells


  • 类型:Array,
  • 默认值:[]
  • 描述:栅格主体

方法

initGrid()


  • 参数:无,
  • 返回值:无
  • 描述:重置或初始化栅格

randomCell()


  • 参数:无,
  • 返回值:{Object} {x: posX, y: posY, value: value}其中,x 和 y 表示单元格的坐标值,value为随机携带的数值
  • 描述:随机获取可用单元格

availableCells()


  • 参数:无,
  • 返回值:{Object}
    • avail {Array} 返回未用单位格位置 {x: posX, y: posY} 组成的数组
    • unavail {Array} 返回已占用单元格 {x: posX, y: posY, value: value} 组成的数组
  • 描述:返回包含单元格状态的对象

availableCellInline(cell, end, line)


  • 参数:
    • {Object} cell 期望获取可用目标的单元格 {x: posX, y: posY, value: value}
    • {Number} end 搜索的结束索引
    • {String} "row"|"col" line 期望搜索行或列
  • 返回值:{Object} 搜索结果值 {x: posX, y: posY, value: value}
  • 描述:当进行移动时搜索单元格可达到的位置

updataCell(type, position, value, newCell)


  • 参数:
    • {String} "fill"|"remove" type 操作类型
    • {Object} 更新的位置 {x: posX, y: posY}
    • {Number} 更新值
    • {Boolean} newCell 是否为新建单元格
  • 返回值:无
  • 描述:更新单元格状态

moveCells(key, imitate)


  • 参数:{Number} key keyCode,
  • 返回值:
    • {Array} moveCells 包含一个由移动单元格与目标单元格组成的数组
    • {Boolean} imitate 是否模拟移动栅格
  • 描述:根据key值移动单元格,当imitat为true时只返回moveCells

Tile

Tile对象是所有DOM对象的操作接口,包括数字砖的创建、数值更改、链接功能键以及数字砖的特效

属性

container


  • 类型:Object,
  • 默认值:DOM对象
  • 描述:游戏区域的容器

scoreTile


  • 类型:Object,
  • 默认值:DOM对象
  • 描述:记录当前分值的数字砖

bestTile


  • 类型:Object,
  • 默认值:DOM对象
  • 描述:记录历史最高分的数字砖

newGame


  • 类型:Object,
  • 默认值:DOM对象
  • 描述:重启游戏的功能键

方法

createTile(position, value)


  • 参数:
    • {Object} position 数字砖的位置信息 {posX: x, posY: y}
    • {Number} value 数字砖的数值
  • 返回值:无
  • 描述:绘制数字砖

delTile()


  • 参数:无,
  • 返回值:无
  • 描述:移除容器中的数字砖对象

moveTile(oldPosition, newPosition)


  • 参数:
    • {Object} oldPosition 将要移动的单元格位置 {posX: x, posY: y}
    • {Object} newPosition 移动目标 {posX: x, posY: y}
  • 返回值:无
  • 描述:将原单元格移动到新的位置

KeyboardManager

KeyboardManager对象监听了用户操作相关的事件,其中包括键盘输入与触屏

属性

events


  • 类型:Object,
  • 默认值:null
  • 描述:events 属性用来储存目标事件以及它们对应的回调函数

start


  • 类型:Object,
  • 默认值:null
  • 描述:start 属性用以储存触屏事件开始时的位置信息

end


  • 类型:Object,
  • 默认值:null
  • 描述:end 属性用以储存触屏事件结束时的位置信息

方法

on(event, callback)


  • 参数:
    • {String} event 监听的事件名称
    • {Function} callback 事件对应的回调函数,可有多个
  • 返回值:无
  • 描述:添加事件监听

emit(event, data)


  • 参数:
    • {String} event 触发的监听事件名称
    • {String|Object|Function|Array|Number}} data 可选,针对不同回调而定
  • 返回值:无
  • 描述:触发监听事件

listen()


  • 参数:无
  • 返回值:无
  • 描述:事件监听总线,初始时调用

localStorageManager

locaStorageManager对象管理着游戏过程的数据状态,并将它们储存至本地

属性

gameState


  • 类型:String,
  • 默认值:"gameState"
  • 描述:gameState 对应了栅格状态的本地存储对象名

gameScore


  • 类型:String,
  • 默认值:"gameScore"
  • 描述:gameScore 对应了游戏分数的本地存储对象名

bestScore


  • 类型:String,
  • 默认值:"bestScore"
  • 描述:bestScore 对应了游戏最高分数的本地存储对象名

storageManager


  • 类型:Object,
  • 默认值:window.localStorage
  • 描述:storageManager 存储了进行过兼容性处理的localStorage对象

getGameState(item)


  • 参数:{String} item 本地存储对象名,
  • 返回值:{Array|Number} 本地存储对象
  • 描述:获得本地存储对象

setGameState(item, value)


  • 参数:
    • {String} item 本地存储对象名,
    • {Array|Number} value 存储值
  • 返回值:无
  • 描述:存储数据

clearGameState()


  • 参数:无,
  • 返回值:无
  • 描述:清除本地游戏分数及状态

getBestScore()


  • 参数:无,
  • 返回值:{Number} 本地最高分数
  • 描述:获得本地最高分数

setBestScore(value)


  • 参数:{Number} value 期望存入的分数,
  • 返回值:无
  • 描述:存储最高分