Object-oriented Programming in JavaScript, Day 2

Today’s topics

• Reviewing and practicing object-oriented techniques
• Understanding how to use canvas and requestAnimationFrame
• Building up a working application in stages

Project

Build a game, Day 2

This project is due on Thursday, June 11. Continue working with your study group!

Links and resources

• Mary Rose Cook’s annotated code
• updated space invaders code
• short video that explains the canvas coordinate system
• more explanation about canvas context object and coordinates, with illustrations – this is old but much of the detail is still accurate
• Clinton’s session for Team One on movement and collision Access Password: 4I?6w!=?
• Clinton’s Speedboat game with class syntax

⭐️EXTRA/TMI

Kyle Simpson’s You Don’t Know JS series of books has been around for 5+ years which is about 1000 years in JS time. He is currently updating the whole series and kindly shares all of his writing on GitHub. He’s still writing the second edition of his book on this & Object prototypes, so you’ll have to make do with the first edition. I find that he is really good at explaining things clearly, although this is not really beginner material. Still, if you need to know more, I would recommend reading what he has to say.

• You Don’t Know JS: this & Object Prototypes - 1st Edition

This covers the basic details of using the canvas element, and goes deeper in things like drawing curves and custom shapes and using sprites:

• Eloquent JavaScript: Drawing on Canvas

Code, slides, and video from class

• game starter code