一，今天完成的事情

（1）今天还在怼任务四，想写能复用，拿原型模型写一个对象，然后新建实例调用，保存实例，重回页面之后调用实例，下午金超师兄交流了一波面对对象编程方面的东西，如果写能复用的要封装的对象，不必考虑语义化，怎么方便怎么来，提供了一个将状态用数字表示的思路，判断数字大小，来判断处于的状态，再进行相应的操作，这样能省很多事啊！

（2）下午重写法官查看页面之后，遇到了很多问题，第一个，使用JSON的stringify函数把对象转换为字符串之后再用sessionstorage储存，再用parse转换出来之后只剩下字符串对象了，不知道为啥会这样，自己研究了很久都搞不懂，只猜测应该是JSON转换字符串的时候出问题了，后来和金超师兄一起研究了一波（好吧。。。主要是他研究），发现就是JSON的stringify无法序列化函数对象，函数对象的value直接返回undefined，undefined会被stringify忽略掉，所以只剩下字符串对象了。那如何传递函数或者说方法呢？帅的一比的金超师兄跟我说，像angular这种组件库，都是直接把包括函数的所有对象放在一个大对象里面，每个页面都会使用这个对象，所以方法传递只在这个大对象中进行，就不存在转不转JSON，存储再解析的问题了。

贴一波重写的状态机（把两个状态机写进一个对象，然后调用）

function Step() {
}
Step.prototype = {
//    当前状态，步骤1
    state1: "1",
    //切换步骤状态机
    trans1: function() {
        switch (this.state1) {
            case "1":
                this.state1="2";
                change_click();
                break;
            case "2":
                this.state1="3";
                change_click();
                break;
            case "3":
                this.state1="4";
                change_click();
                break;
            default:
                console.log("Invalid State");
                break;
        }
    },
    //切换开启关闭状态机
    state2: "1",
    trans2: function(a) {
        switch(this.state2) {

            case "1":
                this.state2 = "2";
                a.parentNode.className = "dropdown";
                break;
            case "2":
                this.state2 = "1";
                a.parentNode.className = "open dropdown";
                break;
            default:
                console.log("Invalid State")
        }
    }
};

然后写一个循环，循环调用状态机，通过状态机的数字大小，判断该步骤的按钮的onclick该执行啥。

function change_click() {
    for (var i = 0; i < btns.length; i++) {
        var num = parseInt(Step1.state1);
        if (i < num - 1) {
            c_color(btns[i]);
            btns[i].onclick = function () {
                confirm("请进行下一项活动");
            }
        }
        else if (i == num - 1) {
            btns[i].onclick = function () {
                Step1.trans1();
                c_color(this);
                if (num == 1) {
                    var storage = window.sessionStorage;
                    var s = JSON.stringify(Step1);
                    storage.setItem("data", s);
                    console.log(storage.data);
                    window.location.href="task7-7.html";
                }
                else if (num == 2) {
                    confirm("请死者亮明身份并且发表遗言")
                }
                else if (num == 3) {
                    confirm("玩家依次发言");
                }
                else if (num == 4) {
                    var s = JSON.stringify(Step1);
                    storage.setItem("data", s);
                    console.log(storage.data);
                    window.location.href="task7-8.html";

                }
            }
        }
        else if (i > num - 1) {
            btns[i].onclick = function () {
                confirm("请按顺序执行");
            }
        }
    }
}
document.getElementsByTagName("body")[0].onload = function() {
    change_click();
};

二，明天要做的事情

完成任务四的JS版本。（嗨呀，就一个星期没改过）老大难的问题搞定了，进度应该又可以动起来了~

三，遇到的问题

页面之间如何传递函数或者说是方法。

四，收获

1.从金超师兄那get了状态用数字表示（抽象），然后通过判断状态来进行一些操作。

2.JSON的了解更进一步，之前只知道stringify和parse怎么用，而不知道原理，今天通过这个函数搞清楚了，转为字符串，不符合JSON的语法就忽略掉。

3.今天感谢一波@金超师兄，666666送给你~