Son Hava Bükücü
Picopat
- Katılım
- 6 Ağustos 2020
- Mesajlar
- 455
Daha fazla
- Cinsiyet
- Erkek
- Meslek
- Yazılımcı
Arkadaşlar şu kodlardan pek bir şey anlamayan lakin W3schoolsun quizinden başarıyla geçmiş(25'de 22'yi bilerek), linkedinin JS rozeti alma quizinden başarıyla geçmiş biri kendine JS biliyorum diyebilir mi?
Kod:
class snakeGame{
constructor(){
this.canvas=document.getElementById('game');
this.context=this.canvas.getContext('2d');
document.addEventListener('keydown',this.onKeyPress.bind(this));
}
init() {
this.positionX=this.positionY=10;
this.appleX=this.appleY=5;
this.tailSize=5;
this.trail=[];
this.gridSize=this.tileCount=20;
this.veloCityX=this.veloCityY=0;
this.timer=setInterval(this.loop.bind(this),1000/15);
}
reset(){
clearInterval(this.timer);
this.init();
}
loop(){
this.update();
this.draw();
}
update(){
this.positionX+=this.veloCityX;
this.positionY+=this.veloCityY;
if (this.positionX<0) {
this.positionX=this.tileCount-1;
}
if (this.positionY<0) {
this.positionY=this.tileCount-1;
}
if (this.positionX>this.tileCount-1) {
this.positionX=0;
}
if (this.positionY>this.tileCount-1) {
this.positionY=0;
}
this.trail.forEach(t=>{
if (this.positionX==t.positionX&&this.positionY==t.positionY) {
this.reset();
}
});
this.trail.push({positionX:this.positionX,positionY:this.positionY});
while(this.trail.length>this.tailSize){
this.trail.shift();
}
if (this.appleX==this.positionX&&this.appleY==this.positionY) {
this.tailSize++;
this.appleX=Math.floor(Math.random()*this.tileCount);
this.appleY=Math.floor(Math.random()*this.tileCount);
}
}
draw(){
this.context.fillStyle='black';
this.context.fillRect(0,0,this.canvas.width,this.canvas.height);
this.context.fillStyle='white';
this.context.font='20px Arial';
this.context.fillText(this.tailSize-5,20,40);
this.context.fillStyle='red';
this.trail.forEach(t => {
this.context.fillRect(t.positionX*this.gridSize,t.positionY*this.gridSize,this.gridSize-5,this.gridSize-5);
});
this.context.fillStyle='pink';
this.context.fillRect(this.appleX*this.gridSize,this.appleY*this.gridSize,this.gridSize-5,this.gridSize-5);
}
onKeyPress(e){
if (e.keyCode==37&&this.veloCityX!==1) {
this.veloCityX=-1;
this.veloCityY=0;
}
if (e.keyCode==38&&this.veloCityY!==1) {
this.veloCityX=0;
this.veloCityY=-1;
}
if (e.keyCode==39&&this.veloCityX!==-1) {
this.veloCityX=1;
this.veloCityY=0;
}
if (e.keyCode==40&&this.veloCityY!==-1) {
this.veloCityX=0;
this.veloCityY=1;
}
}
}
const game=new snakeGame();
window.onload=()=>game.init();
Son düzenleyen: Moderatör:
