今天完成的事：

完成任务三法官查看页

1.首先需要在“查看身份页”获取到上个页面传递过来的数据

var users = window.localStorage.users;
var result = JSON.parse(users);//JSON.parse()【从一个字符串中解析出json对象】

2.然后循环遍历result数组：

for (var i = 0; i < result.length; i++) {

3.声明一个mod变量，渲染result数组内的玩家：

var mod = `<div class="main" >
    <div class="box1">${result[i].identity}</div>
    <div class="box2">${i + 1}号</div>
    <div class="photo">
        <img src="../img/task-7/task-2-4.png" alt="">
        <img src="../img/task-7/task-2-5.png" alt="">
        <img src="../img/task-7/task-2-6.png" alt="">
        <img src="../img/task-7/task-2-7.png" alt="">
    </div>
</div>`;

在html文档中的<main></main>中插入这个mod变量中的内容：

$("main").append(mod)

对法官查看页展示的玩家页面设置点击事件，获取玩家到点击的玩家，并判断此玩家的存活状态。

$(".main").click(function () {
    // 获取到当前点击的那个玩家
    var index = $(".main").index($(this));
    alert(result[index].alive);
    // 判断玩家是够存活
    result[index].alive = 2;
    alert(result[index].alive)
});

什么是javaScript有限状态机:

简单说，有限状态机是一种模型，模型都用来模拟事物，能够被有限状态机这种模型模拟的事物，一般都有以下特点：

1）可以用状态来描述事物，并且任一时刻，事物总是处于一种状态；

2）事物拥有的状态总数是有限的；

3）通过触发事物的某些行为，可以导致事物从一种状态过渡到另一种状态；

4）事物状态变化是有规则的，A状态可以变换到B，B可以变换到C，A却不一定能变换到C；

5）同一种行为，可以将事物从多种状态变成同种状态，但是不能从同种状态变成多种状态。

使用javascript-state-machine库实现状态机

只要引入该库的js之后就能通过该库提供的一个全局对象StateMachine，并使用该对象的create方法，生成有限状态机的实例

initial选项用来表示fsm对象的初始状态，events选项用来描述fsm对象所有状态的变化规则，每一种变化规则对应一种行为（不过有可能多个规则会对应同一个行为，在后面你会看到这样的例子）。create方法为实例的每一种行为都添加了一个方法，调用这个方法就相当于触发对象的某种行为，当对象行为发生时，对象的状态就可以发生变化

1 ) 有限状态机是定义组件的一种好用的模式，能够让组件的代码看起来更加清晰，而且易于理解；

2）javascript-state-machine也是一个优秀的实现库，源码简洁，提供的API用法简单，同时还突出了状态机的特点，值得在定义组件的时候去试一试；

3）有限状态机这种模式适合有明显状态特点的组件；

4）在使用javascript-state-machine的时候，既可以直接在fsm的基础上定义组件，也可以在组件内部通过一个私有成员来保留一个fsm（内部状态机）；

明天计划的事：继续任务四

遇到的问题：设置玩家的死活状态这一块有点不太明白。

收获：完成任务三，