Snake Game Javascript Code

| Posted on by

Active3 years, 11 months ago

I'm really new to Javascript, so I decided to create a simple SnakeGame to embed in HTML. However, my code for changing the snake's direction freezes up after a few turns.

Javascript Code For Snake Game Explained

Note: I'm running this in an HTML Canvas.

Source:

  • New Game High Scores. Credits ( use the arrow and enter keys for control ) 53 FPS (0-53).
  • Basic Snake HTML Game. Snake is a fun game to make as it doesn't require a lot of code (less than 100 lines with all comments removed). This is a basic implementation of the snake game, but it's missing a few things intentionally and they're left as further exploration for the reader.

Where to download wiiware games. Mar 28, 2019  JavaScript is one of the most demanding programming languages right now, there are so many libraries of JavaScript. So, There is a snake game built with JavaScript, HTML & CSS little bit. This is a very basic program. This snake game is like the legend game came with a Nokia Keypad phones. You can call this a coding game or game with coding.

Thanks

michael99manmichael99man

1 Answer

As Evan said, the main issue is how you are handling pending directions.

The issue occurs when you turn twice in rapid succession, which causes two pending directions to be added for the same block. If these aren't handled in the correct order, then the blocks may move in the wrong direction. On every update, only one pending direction for each block is needed, so I redesigned how this is handled to avoid multiple directions on one block during a single update.

Coded Snake Game Javascript

Here is the link to it: http://jsbin.com/EkOSOre/5/edit

Notice, when a change in direction is made, the pending direction on the first block is updated, overwriting any existing pending direction.

Then, when an update occurs, the list of blocks is looped through, and the pending direction of the next block is set to be the current direction of the current block.

If the current block has a pending direction, set the direction to the pending direction.

Then update the block locations like normal.

You also had various other issues, such as using a variable (b) before it was initialized, and how you caught the null/undefined error (you should just do a check for that situation and handle it appropriately), but this was the main issue with your algorithm.

You'll also want to remove the old blocks when the user hits 'n', because the old one is left, increasing the speed and number of total blocks present.

Good luck with the rest of the game, and good luck learning JavaScript.

Snakeforgivenson

Javascript Snake Game Code Simple

Codeforgivenson
3,9892 gold badges15 silver badges28 bronze badges

Not the answer you're looking for? Browse other questions tagged javascript or ask your own question.

Snake is a fun game to make as it doesn't require a lot of code (less than 100 lines with all comments removed). This is a basic implementation of the snake game, but it's missing a few things intentionally and they're left as further exploration for the reader.

Nov 01, 1977  Download this app from Microsoft Store for Windows 10, Windows 10 Mobile, Windows 10 Team (Surface Hub), HoloLens. See screenshots, read the latest customer reviews, and compare ratings for PDF Reader - View, Edit, Share. Aug 30, 2019  We've compiled a list of the top 10 best PDF readers for Windows PCs for the year 2019. This list includes the likes of Adobe Acrobat Reader DC. Pdf download for windows 10. PDF Reader for Windows 10 is a lightweight and full-featured PDF viewer used to open, read, view, review, and print Adobe PDF files. Convert PDF to TXT, BMP, JPG, GIF, PNG, WMF, EMF, EPS, TIFF with. Download PDF Reader for Windows 10 for free. PDF Reader for Windows 10 - Open, read, view, review and print Adobe PDF files, and convert PDF to TXT, BMP, JPG, GIF, PNG, WMF, EMF, EPS, TIFF with this lightweight yet full-featured free PDF viewer as an alternative to Microsoft Windows Reader.

For HP products a product number. Windows setup install drivers. Examples: LG534UA. Use product model name: - Examples: laserjet pro p1102, DeskJet 2130. Ensure correct spelling and spacing - Examples: 'paper jam'.

Further Exploration

  • Score
    • When the snake eats an apple, the score should increase by one. Use context.fillText() to display the score to the screen
  • Mobile and touchscreen support
    • Allow the game to be scalled down to a phone size. See https://codepen.io/straker/pen/VazMaL
    • Support touch controls
  • Better apple spawning
    • Currently the apple spawns in any random grid in the game, even if the snake is already on that spot. Improve it so it only spanws in empty grid locations

License

(CC0 1.0 Universal) You're free to use this game and code in any project, personal or commercial. There's no need to ask permission before using these. Giving attribution is not required, but appreciated.

Other Basic Games