JS写游戏

最近在看萧井陌的视频。感觉一些东西挺有意思的,尤其是解决问题的过程,以及一个好程序应该改进的地方。

萧大的GITHUB:github.com/guaxiao/gua.game.js

视频:https://space.bilibili.com/39066904#!/

拖拽

拖拽是3个过程,mousedown,mousemove,mouseup
mousedown:记录最开始的坐标和状态(改为可拖动)
mousemove: 状态可拖动,坐标发生改变
mouseup:记录结束的坐标和状态(改为不可拖动)
 
 

键盘事件监听

//注册键盘监听事件
window.addEventListener('keydown',function(e){
var thisKey = e.key;
)}

逻辑判断

let a = 1,
        b,
        c = undefined,
        d = null ,
        f = 'null' ,
        g = false,
        h = 'false'
        
    let aa = {
        one : a && 11,    //11
        two : b && 22,    //undefined
        three : c && 33,  //undefined
        four : d && 44,      //null
        five : f && 55,   //55
        six : g && 66,      //false
        seven : h && 77   //77
    }
    console.log(aa.one,aa.two,aa.three,aa.four,aa.five,aa.six,aa.seven)
    let bb = {
        one : a || 11,   //1
        two : b || 22,   //22
        three : c || 33, //33
        four : d || 44,  //44
        five : f || 55,  //"null"
        six : g || 66,   //66
        seven : h || 77  //"false"
    }
    console.log(bb.one,bb.two,bb.three,bb.four,bb.five,bb.six,bb.seven)
one : a && 11,
当a为真时,one的属性值为 11
当a为undefined时,one的属性值为undefined
当a为null时,one的属性值为null
当a为false时,one的属性值为false
当a为字符串时,one的属性值为11

two : a || 11,
当a为真时,two的属性值为a的值
当a为null,undefined,false时,two属性值为11
//优先级()> && > ||
        let    a = 11 &&  22 || 33          //22  
            b = (11 &&  22) || 33         //22
            c = false && 22 || 33         //33
            d = 11 || 22 && 33             //11
            e = false || 22 && 33         //33
            f = (11 || 22) && 33         //33
            g = (11 && 22) && 33         //33
            h = false && 22 && 33        //false
            i = 11 && 22 || 33 && ( 44 && 55)  //22
            j = (11 && 22) && 33 || 44 && 55  //33
            k = (11 && 22) && (33 || 44) && 55 && false //false
        console.log(a,b,c,d,e,f,g,h,i,j,k)   

计算的优先级

括号 > && > ||

在确立优先级的情况下从左往右计算

三元运算符 ?:

作用是判断?前的语句是否为真,为真则执行中间的语句,否则执行后面的语句

log("你是人是鬼?") ? alert("你是人") : alert("你是鬼!")

图片的预加载

先载入图片,这样的话,就好用很多

参考http://www.cnblogs.com/v10258/p/3376455.html

原文地址:https://www.cnblogs.com/miangao/p/7474695.html