A walkthrough of refactoring a single-canvas HTML5 scratch-off effect into a reusable, multi-instance JavaScript object. Covers identifying utility functions, moving global variables into a constructor, converting functions to prototype methods, and handling the tricky 'this' binding problem inside event handlers using bind(),
Table of contents
Step 1: Identify Utility FunctionsStep 2: Move Globals to ConstructorStep 3: Move Functions to MethodsStep 4: Presentation LayerFurther WorkCode and ReferencesSort: