js扫雷小游戏

扫雷是winxp中的一个金典小游戏，看的简单，但是里面还是有些算法的，下面就跟着小编一起来了解下吧

 

游戏规则：

1. 雷周围的方块显示雷的个数
2. 点击不在雷周围的方块消除所有与之相连接的方块
3. 点击到雷结束游戏

思路：

1. 产生指定数量的地雷
2. 计算方块周围的地雷
3. 点击地雷结束
4. 点击地雷周边显示地雷个数
5. 点击空白块，消除所有相连的空白块

开始写代码产生随机数量的地雷有多种方式，随机数，但是会存在一个问题，就是可能产生重复的数据，所以项目中使用另一种方式，洗牌式，比如说产生1-100的不重复的20个随机数，先生成一个100容量的数组，然后将数组打乱，最后取出数组的前20位

randomNumber:  function (total,size){/***产生随机数**/
		        var result=[];//最后的结果集
		        var temp=[];//临时变量
		        for(var i=0;i

计算方块周围的地雷，这个比较简单，for循环遍历就可以了

  //计算每个方块周围的炸弹个数
			    for(var i=0;i=0&&tempx=0&&tempy

点击空白块消除相连的所有空白块，这个就需要一点小小的算法知识了，思想其实很简单，之前学数据结构时有一个寻找路径问题，其实这个也是一样的，通过入栈出栈操作就能够完成

//清除相邻白块
            clearblack:function(i,j,list){
                //创建任务栈
                var stack=[];
                var item={};
                item.x=i;
                item.y=j;
                item.index=1;
                var totalX=this.row;
                var totalY=this.col;
                stack.push(item);
                do{
                    //获取堆栈最上面的一个元素
                    var length=stack.length;
                    if(length>0){
                        var temp=stack[length-1];
                        //根据index获取下一个元素的坐标
                        if(temp.index>4){
                            //删除最后一个元素
                            stack.pop();
                        }else if(temp.index==1){
                            //当下一个元素时空时
                            if(temp.x-1>=0&&temp.x-1=0&&temp.y=0&&temp.x=0&&temp.y+1=0&&temp.x+1=0&&temp.y=0&&temp.x=0&&temp.y-10);
                return list;
            },

好了，主体的代码就是这么多，具体详细的代码在 https://github.com/zhangruizhi123/win/tree/master/app/sweep

所有代码

效果：