我在这个开源项目里找到了童年！

提到《俄罗斯方块》（Tetris），那真是几乎无人不知无人不晓，除此以外，相信许多程序员第一个编程实践项目就是编写一个俄罗斯方块或者是坦克大战

这类的游戏各类编程语言的实现版本都有，今天和你们分享一个用React 编写的俄罗斯方块，在移动端和 PC 都能运行。

先上效果让大家预览一下：

Redux 状态预览

这个游戏的框架使用的是 React + Redux，其中再加入了 Immutable，用它的实例来作来Redux的state。

Immutable 是一旦建立，就不能再被更改的数据。对 Immutable 对象的任何修改或添加删除操做都会返回一个新的 Immutable 对象。

让咱们看下面一段代码：

functionkeyLog(touchFn){

letdata = {key:'value'};

f(data);

console.log(data.key);// 猜猜会打印什么？

}

不查看f，不知道它对 data 作了什么，没法确认会打印什么。但若是 data 是 Immutable，你能够肯定打印的是 value：

functionkeyLog(touchFn){

letdata = Immutable.Map({key:'value'});

f(data);

console.log(data.get('key'));// value

}

建立者在GitHub上作了详细的介绍，他在游戏中添加了不少不一样的音效，实际上只有一个音效文件，他借助Web Audio Api可以以毫秒级精确、高频率的播放音效，这是<audio>标签所作不到的。在游戏进行中按住方向键移动方块，即可以听到高频率的音效。

游戏的控制流程以下：

若是你是一名前端工程师而且对React感兴趣，拿这个游戏做为练手项目是很是不错的，若是不是，也能够把它当作茶余饭后的休闲项目

目前这款小游戏已经在GitHub上得到了 5058 个Star，840 个Fork

项目地址：https://github.com/chvin/react-tetris

来源： 开源最前线

欢迎关注个人公众号：【编程资源库】 ，关注后回复“我来自互联网”便可领取2000G视频教程