发表于: 2017-03-25 01:05:52

2 1277


今天完成的事情:任务四杀手杀人页面的JS逻辑,恶补了一下函数、数组方面的知识。
明天计划的事情:请假一天
遇到的问题: 任务4设计很多逻辑、数据传递的问题,需要思路很清晰且对常见的解决办法有个总体把握,在昨天对整个游戏流程优化后今天完成杀手页的思路是:

1.获取之前储存的身份信息并输出,这一步同法官台本页。

2.因为杀手杀人不能杀自己,所以设置杀手身份为灰色不可点击,平民则设置鼠标滑过变色。

or(i=0; i < all.length; i++){
play += '<div class="main-box">'  +
'<div class="main-box-open">' + all[i] + '</div>'+
'<div class="main-box-number">' + (i + 1) + '号</div>' + '</div>';
   console.log(play);
   $('.main').eq(0).html(play);
   Status[i] = {};//数组中的每个元素都是一个对象,包括身份、号码、状态
   Status[i].num = i + 1;
   Status[i].identity = all[i];
   Status[i].status = "alive";
   Status[i].day = 1;
   console.log(Status);
}
var allName = document.getElementsByClassName('main-box-open');
//杀手牌面显示禁用
for (var j = 0; j < all.length; j++) {
if (all[j]=='杀手'){
allName[j].style.background = "#9b9b9b";
         allName[j].style.cursor = "not-allowed";
     }
}

3.声明1个数组,用来储存单个玩家的生存状态,一个字符串,用来储存所有玩家的生存状态,具体包括编号、死亡or存活、身份、以及死亡的天数为后面的任务储备

4.定义杀人事件,确保杀手不会被点击的前提下,每次点击刷新状态,并改变被杀死平民的背景色和死亡状态。

var x;
var killPeople;//死亡玩家号码
for (x = 0; x < allName.length; x++) {
allName[x].index = x;
   allName[x].onclick = function () {
//如果某玩家卡牌被点击,则记录并改变这个玩家的状态
       if (all[this.index] == '杀手') {
//确保点击杀手无任何作用
       } else {
if (killPeople != undefined) {
//先检查有没有被选中的人,如果有则将其状态颜色还原
               allName[killPeople].style.background = "#29bde0";
               Status[killPeople].status = "alive";
           }
allName[this.index].style.background = "red";
           killPeople = this.index;
           Status[this.index].status = "killed";
           console.log(Status);
           statusAll = JSON.stringify(Status);
           sessionStorage.Status = statusAll;
           console.log(statusAll);
       }
}
}

5.储存好死亡信息后,设置进入下一个页面的条件

收获:

这个任务暴漏了之前的很多知识储备的不足:

1.

js 数组与对象的区别:
比如有一个数组a=[1,2,3,4],还有一个对象a={0:1,1:2,2:3,3:4},然后你运行alert(a[1]),两种情况下的运行结果是相同的!这就是说,数据集合既可以用数组表示,也可以用对象表示,那么我到底该用哪一种呢?

我后来才知道,数组表示有序数据的集合,而对象表示无序数据的集合。如果数据的顺序很重要,就用数组,否则就用对象。

2.

.index属性 
c[i].index=i
C 表示一个数组,定义方式 var c  = ['a','b','c','d'];
for(var i=0; i<c.length;i++){
   c[i].index=i;
  当前元素的索引,变成i 在这里没花生变坏.因为i从0开始
  数组下标也是0

}

3.this属性



返回列表 返回列表
评论

    分享到