I am working on a Javascript/HTML5 canvas based game and so far my JS code is 1200+ lines long. I am using lots of Objects and lots of different function as well so a question came to my mind.
Is there any possible way to have separate objects in separate JS files and a main file where I would refer to those separated objects in their own JS files? I just want to keep my code simple cause it is starting to look a little messy.
Thank you
Like akluth said, you can use external libraries to "load" your external Javascript files.
If you don't wish to use any of these then it's the gool'ol fashioned JS way: You include all your external files like so:
<script type="text/javascript" src="external/file.js"></script>
You can use requireJS for this - it allows you to seperate your code into AMD modules which can be easily used accross your project.
To have optimized and minified code in your production environment you can use r.js, the requireJS optimizer which allows you to concat all your modules into one minified and uglified file.
The simple answer is yes. You can place each object and its properties and methods in its own file loading each file as Jarrod suggests.
<script type="text/javascript" src="external/main.js"></script>
<script type="text/javascript" src="external/obj1.js"></script>
<script type="text/javascript" src="external/obj2.js"></script>
where 'external' is a directory in the same folder as your HTML file.
