60行js代码实现俄罗斯方块


Posted in Javascript onMarch 31, 2015

这是我之前网上看到的,很牛逼的一位大神写的,一直膜拜中

<!doctype html><html><head></head><body>
<div id="box" style="width:252px;font:25px/25px 宋体;background:#000;color:#9f9;border:#999 20px ridge;text-shadow:2px 3px 1px #0f0;"></div>
<script>
var map=eval("["+Array(23).join("0x801,")+"0xfff]");
var tatris=[[0x6600],[0x2222,0xf00],[0xc600,0x2640],[0x6c00,0x4620],[0x4460,0x2e0,0x6220,0x740],[0x2260,0xe20,0x6440,0x4700],[0x2620,0x720,0x2320,0x2700]];
var keycom={"38":"rotate(1)","40":"down()","37":"move(2,1)","39":"move(0.5,-1)"};
var dia, pos, bak, run;
function start(){
  dia=tatris[~~(Math.random()*7)];
  bak=pos={fk:[],y:0,x:4,s:~~(Math.random()*4)};
  rotate(0);
}
function over(){
  document.onkeydown=null;
  clearInterval(run);
  alert("GAME OVER");
}
function update(t){
  bak={fk:pos.fk.slice(0),y:pos.y,x:pos.x,s:pos.s};
  if(t) return;
  for(var i=0,a2=""; i<22; i++)
    a2+=map[i].toString(2).slice(1,-1)+"<br/>";
  for(var i=0,n; i<4; i++)
    if(/([^0]+)/.test(bak.fk[i].toString(2).replace(/1/g,"\u25a1")))
      a2=a2.substr(0,n=(bak.y+i+1)*15-RegExp.$_.length-4)+RegExp.$1+a2.slice(n+RegExp.$1.length);
  document.getElementById("box").innerHTML=a2.replace(/1/g,"\u25a0").replace(/0/g,"\u3000");
}
function is(){
  for(var i=0; i<4; i++)
    if((pos.fk[i]&map[pos.y+i])!=0) return pos=bak;
}
function rotate(r){
  var f=dia[pos.s=(pos.s+r)%dia.length];
  for(var i=0; i<4; i++)
    pos.fk[i]=(f>>(12-i*4)&15)<<pos.x;
  update(is());
}
function down(){
  ++pos.y;
  if(is()){
    for(var i=0; i<4 && pos.y+i<22; i++)
      if((map[pos.y+i]|=pos.fk[i])==0xfff)
        map.splice(pos.y+i,1), map.unshift(0x801);
    if(map[1]!=0x801) return over();
    start();
  }
  update();
}
function move(t,k){
  pos.x+=k;
  for(var i=0; i<4; i++)
    pos.fk[i]*=t;
  update(is());
}
document.onkeydown=function(e){
  eval(keycom[(e?e:event).keyCode]);
};
start();
run=setInterval("down()",400);
</script></body></html>

以上所述就是本文的全部内容,希望大家能够喜欢。

Javascript 相关文章推荐
Jquery 设置标题的自动翻转
Oct 03 Javascript
解析URI与URL之间的区别与联系
Nov 22 Javascript
JS中使用Array函数shift和pop创建可忽略参数的例子
May 28 Javascript
微信小程序  网络请求API详解
Oct 25 Javascript
基于vue+ bootstrap实现图片上传图片展示功能
May 17 Javascript
vue.js响应式原理解析与实现
Jun 22 Javascript
微信小程序开发的基本流程步骤
Jan 31 Javascript
详解Vue依赖收集引发的问题
Apr 22 Javascript
微信小程序点击图片实现长按预览、保存、识别带参数二维码、转发等功能
Jul 20 Javascript
基于leaflet.js实现修改地图主题样式的流程分析
May 15 Javascript
JavaScript 中判断变量是否为数字的示例代码
Oct 22 Javascript
在Angular项目使用socket.io实现通信的方法
Jan 05 Javascript
JS动态修改表格cellPadding和cellSpacing的方法
Mar 31 #Javascript
js实现的牛顿摆效果
Mar 31 #Javascript
JS动态显示表格上下frame的方法
Mar 31 #Javascript
JS实现控制表格只显示行边框或者只显示列边框的方法
Mar 31 #Javascript
jQuery选择器源码解读(八):addCombinator函数
Mar 31 #Javascript
JS显示表格内指定行html代码的方法
Mar 31 #Javascript
jQuery选择器源码解读(七):elementMatcher函数
Mar 31 #Javascript
You might like
地球防卫队:陪着奥特曼打小怪兽的人类力量 那些经典队服
2020/03/08 日漫
PHP写MySQL数据 实现代码
2009/06/15 PHP
PHP中判断变量为空的几种方法小结
2013/11/12 PHP
回帖脱衣服的图片实现代码
2014/02/15 PHP
验证坐标在某坐标区域内php代码
2016/10/08 PHP
PHP查询分页的实现代码
2017/06/09 PHP
javascript字典探测用户名工具
2006/10/05 Javascript
关于textarea提交的内容无法换行的解决办法
2013/04/09 Javascript
JS特殊函数(Function()构造函数、函数直接量)区别介绍
2013/05/19 Javascript
instanceof和typeof运算符的区别详解
2014/01/06 Javascript
jQuery DOM操作实例
2014/03/05 Javascript
使用js Math.random()函数生成n到m间的随机数字
2014/10/09 Javascript
js进行表单验证实例分析
2015/02/10 Javascript
详解组件库的webpack构建速度优化
2018/06/18 Javascript
[00:34]DOTA2上海特级锦标赛 Spirit战队宣传片
2016/03/04 DOTA
跟老齐学Python之模块的加载
2014/10/24 Python
使用Python的PEAK来适配协议的教程
2015/04/14 Python
Python实现信用卡系统(支持购物、转账、存取钱)
2016/06/24 Python
听歌识曲--用python实现一个音乐检索器的功能
2016/11/15 Python
python用模块zlib压缩与解压字符串和文件的方法
2016/12/16 Python
Python初学者需要注意的事项小结(python2与python3)
2018/09/26 Python
深入解析python中的实例方法、类方法和静态方法
2019/03/11 Python
结合OpenCV与TensorFlow进行人脸识别的实现
2019/10/10 Python
使用html2canvas实现浏览器截图的示例代码
2018/01/26 HTML / CSS
斯洛伐克时尚服装网上商店:Cellbes
2016/10/20 全球购物
管理科学大学生求职信
2013/11/13 职场文书
学前班教师的自我鉴定
2013/12/05 职场文书
优秀的毕业生的自我评价
2013/12/12 职场文书
农贸市场管理制度
2014/01/31 职场文书
全神贯注教学反思
2014/02/03 职场文书
股东合作协议书
2014/09/12 职场文书
2015届本科毕业生自我鉴定
2014/09/27 职场文书
健康证明
2015/06/19 职场文书
军训结束新闻稿
2015/07/17 职场文书
《思路决定出路》读后感3篇
2019/12/11 职场文书
Redis监控工具RedisInsight安装与使用
2022/03/21 Redis