V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
推荐关注
Meteor
JSLint - a JavaScript code quality tool
jsFiddle
D3.js
WebStorm
推荐书目
JavaScript 权威指南第 5 版
Closure: The Definitive Guide
caiyongji
V2EX  ›  JavaScript

20 行 JS 代码实现贪吃蛇

  •  
  •   caiyongji · 2017-06-14 14:19:42 +08:00 · 2192 次点击
    这是一个创建于 2480 天前的主题,其中的信息可能已经有所发展或是发生改变。
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>20 行 JS 代码实现贪吃蛇</title>
    </head>
    <body>
        <canvas id="can" width="400" height="400" style="background:black;"></canvas>
        <script>
        var sn=[42,41],dz=43,fx=1,n,ctx=document.getElementById("can").getContext("2d");
        function draw(t,c){
            ctx.fillStyle=c;
            ctx.fillRect(t%20*20,~~(t/20)*20,18,18);
        }
        document.onkeydown=function(e){fx=sn[1]-sn[0]==(n=[-1,-20,1,20][(e||event).keyCode-37]||fx)?fx:n};
        !function(){
            sn.unshift(n=sn[0]+fx);
            if(sn.indexOf(n,1)>0 || n<0||n>399||fx==1&&n%20==0||fx==-1&&n%20==19) return alert("GAME OVER");
            draw(n,"Lime");
            if(n==dz){
                while(sn.indexOf(dz=~~(Math.random()*400))>=0);
                draw(dz,"Yellow");
            }else
                draw(sn.pop(),"Black");
            setTimeout(arguments.callee,500);
        }();
        </script>
    </body>
    </html>
    
    4 条回复    2017-06-17 10:00:39 +08:00
    qq292382270
        1
    qq292382270  
       2017-06-14 15:53:18 +08:00
    不会前端的人看起来觉得好 NB ...
    580a388da131
        2
    580a388da131  
       2017-06-14 18:06:57 +08:00
    xiaojunjor
        3
    xiaojunjor  
       2017-06-16 09:58:41 +08:00
    这是 csdn 的 jslang 写的吧,很久之前了
    pyufftj
        4
    pyufftj  
       2017-06-17 10:00:39 +08:00
    有点注释就更好了。。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   4370 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 27ms · UTC 10:08 · PVG 18:08 · LAX 03:08 · JFK 06:08
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.