web小游戏 2048制作（二）:游戏主逻辑 main2048.js

//先创建一个空数组，用来存储16个格子的数据
var board=new Array();
//创建score变量用来内存储分数
var score=0;
//在最初完成后，发现了bug，就是2 2 4，直接合并为了8，
//为了消除这个bug，特意创建此变量，用来使一个格子发生一次叠加后，在刷新面板之前，禁止再次叠加。
var hasConflicted=new Array();
//页面加载完成后，开始一个新游戏
$(document).ready(function(){
	newGame();
});
//新游戏的具体过程
function newGame()
{
	//初始化棋盘格
	init();
	//随机生成一个数字
  randomOneNumber();
  //随机生成一个数字，就如同我们看到的新游戏时的两个数字
  randomOneNumber();
  //刷新分数
  updateScore(score);
}
//初始化棋盘格的过程
function init()
{
  //先建立16个棋盘格子
	for(var i=0;i<4;i++)
	{
		for(var j=0;j<4;j++)
		{
			var gridCell=$("#grid-cell-"+i+"-"+j);
      //每个格子的位置用getPosTop(),getPosLeft()来计算，具体步骤在support.js里
			gridCell.css("top",getPosTop(i,j));
			gridCell.css("left",getPosLeft(i,j));
		}
	}
  //再将用于存储数据的board初始化为4*4的数组
		for(var i=0;i<4;i++)
	{
		board[i]=new Array();
    hasConflicted[i]=new Array();
		for(var j=0;j<4;j++)
		{
			board[i][j]=0;
      //此处依然为每个数字没有发生叠加
      hasConflicted[i][j]=false;
		}
	}
  //分数设置为0
  score=0;
  //刷新面板
	updateBoardView();

	
}
  //刷新面板具体过程
  function updateBoardView()
  {
    //先移除上一次面板数据
  	$(".number-cell").remove();
    //再重新为每个格子插入新数据
  	for(var i=0;i<4;i++)
  	{
      		for(var j=0;j<4;j++)
      		{
            //首先先为整个容器插入4*4的数字块，和格子正好覆盖，并且编好号
      			$(".grid-container").append("<div class='number-cell' id='number-cell-"+i+'-'+j+"'></div>"); 
            //将遍历过程中的某个数字块赋值给theNumberCell
      			var theNumberCell=$("#number-cell-"+i+"-"+j); 
            //如果此数字块的值为0，则此数字块不显示
                  if(board[i][j]==0)
              {
                theNumberCell.css('width','0px