今天的完成：

今天的把小课堂的ppt准备好，小课堂准备的内容是关于bootstrap的布局的问题，关于栅格布局有哪些布局的模式， lg、md、sm、在栅格系统中各有什么意义，它能产生什么作用，在不引入bootstrap的组件的情况下，如何自制栅格系统，已经如何设置栅格中的参数。

今天的问题：

在下载了有限状态机的组件后，我在放在文件夹中在html文件中进行引入，发现引发失效，在反复了验证了之后，发现还是不能发现引入失效的原因。

今天的收获：

create方法为实例的每一种行为都添加了一个方法，调用这个方法就相当于触发对象的某种行为，当对象行为发生时，对象的状态就可以发生变化。

fsm.warn() - 调用该方法，实例状态将从'green'变为'yellow'

fsm.panic() - 调用该方法，实例状态将从'yellow'变为'red'

fsm.calm() - 调用该方法，实例状态将从'red'变为'yellow'

fsm.clear() - 调用该方法，实例状态将从'yellow'变为'green'

这里有个疑问：这四个方式是如何让状态发生变化的，里面并没有看到变换状态的函数事件，是需要在方法中加入函数事件，还是把这个方法设置成变量，因为没有看到这个方法实现前需要满足的条件。

onbeforeevent - 在任何行为发生之前触发

onleavestate - 在要改变对象状态时触发

onenterstate - 在把当前状态设置为新状态时触发

onafterevent - 在任何行为发生之后触发

这里这四个回调函数，了解的作用是，当我点击杀手杀人这个状态触发之前。调用回调函数，然后进入杀人页面进行杀人。杀人结束，进入法官台本进入下一个状态。

fsm.onentersatisfied = null;

fsm.onleavestate = function(event, from, to) {

    console.log('状态变了！，变之前：' + from + '，变之后：' + to);

}

这些回调可以在初始化的时候，通过callbacks选项传给create来初始化，也能通过直接修改实例的属性来增加或修改，用这段代码，可以看到把最后的状态初始化到最初的状态。

明天的任务：

目前还是做任务4