开发微信游戏项目总结

整体项目架构：前端的js小游戏->后端的抽奖->公布结果并分享->游戏结束

我负责前端的所有游戏的编写以及界面的处理

编写过程中所遇到的前端的问题总结在这里：

1.关于游戏进行中的“卡顿”现象（即手指触摸事件不灵敏，触摸后事件并不被触发）：

当时考虑是两种情况：第一种：多线程直接的ui（后来发现并不是这个问题，我的后台js程序很小并不涉及大型计算或者通过服务器查询后端的数据库神马的，前后台对ui的抢占并不能导致这个问题，测试方法：将后台js程序加一个1到10000的for循环），当软处理办法我也找到了，这里可以参见WPF模型，这里不做过多解释。

第二种情况：触发事件本身机制所导致的:DOM事件定义了两种事件流（文本节点也会触发事件）：1.冒泡事件流     2.捕获事件流

分别解释一下：冒泡事件流：当事件在某一DOM元素被触发，事件就会伴随这该dom节点向上追寻其父节点一直冒泡到document节点。

    捕获事件流：事件是一个模糊的目标，从DOM层次的根开始（不是触发事件的目标元素）向下追寻一直到目标元素节点。

一般来说浏览器默认冒泡事件流，w3c模型可以友好的结合这两种触发机制，每次事件触发时，w3c模型都会先从document开始做一次捕获事件流，找到目标元素后，在做一次冒泡事件流回到document。因此事件分为三个阶段：事件捕获阶段->处于目标阶段->事件冒泡阶段。作为程序员来说，可以人为的控制事件捕获和事件冒泡，通过addEventListener()方法来实现：element.addEventListener("click",doSomething,true);(第三个参数：true=捕获；false=冒泡)

一般的触发事件实现:element.onclick = function(){};

言归正传回到正题，讨论一下刚才的bug是什么导致的，我采用的是仪的触发事件，所以也就是说浏览器会默认冒泡事件，会遍历到一些没有必要的父节点及以上节点，所以会导致这个冒泡还没有结束，我又要触发下一个事件了，导致“卡顿”。处理办法很简单，阻止冒泡事件就可以了。

继续解释一下：阻止事件传播：

e.stopPropagation();     (W3c)（在哪里执行，从哪里开始之后的行为都不会发生）

cencelBubble = true;      (IE)

    阻止浏览器对事件的默认行为：

e.preventDefault();          (W3c)

window.event.returnValue = false;     (IE)

阻止事件传播和阻止浏览器对事件默认行为是有区别的：阻止事件传播是指阻止事件的冒泡或捕获的传播方式，阻止事件默认行为是指阻止浏览器对时间的响应，比如:<a>标签跳转，当点击一个链接的时候，在执行完冒泡或捕获事件后，会触发链接的默认事件：跳到指定的链接地址。
2项目中涉及不同的js之间的相互调用变量问题，使用条件：1.该变量为全局变量   2.document.write（"<script src=""></script>"）;
未完待续...