.js file format
I was wondering if there is a good reference to how best to format .js files?
Do you treat them like you would class files or do you separate out the functionality based off the page it handles? Do you create .js functions that could be used across several pages or do you write a custom .js file for each page?
I'm just curious if there is a formal way rather than just writing a bunch of functions that may or 开发者_C百科may not be group together for a specific page or set of pages. Right now I try to group by the functionality of the page but my .js files are very custom for that page, not sure if they are usable on a different page.
::UPDATE::
Some of the answers have the same theme and mostly about what you plan on doing with the project. Right now the project is real new to me and the requirements are slow in coming. So I'm building it page by page. There could be cross functionality or similar functionality in the future. Most of the functionality is very specific to the specific page though.
Is it wise to group AJAX calls into a .js but then also have a custompage .js that contains all of the very custom features of the page.
Typically with javascript you'll want to reduce the amount of separate javascript files you include on your pages to reduce HTTP requests.
A great starting point would be for you to watch Rebecca Murphys building apps with jQuery presentation and read her blog post about using objects to organize your js.
it really depends on what you're trying to accomplish. are you trying to build a library to use across different pages on your site? then you group stuff together in a js and reference it in a masterpage, or each page that needs that library.
are you trying to compartimentalize code and keep it tidy? then make a separate js file for an specific page.
One of the ways to handle custom events on a per-page basis is to define an Object holds callback functions for each page. You can use the ID of the <body>
, or something similar.
You can use something like,
my_app.page_handlers = {
foo: function() { /* ... */ },
bar: function() { /* ... */ }
/* ... */
}
So a page that loads with <body id="foo">
will execute the function my_app.page_handlers.foo()
.
You can dump all the functions into one file (e.g. page_handlers.js
), and then move them into their own file when you see the need to.
I like to copy Python's module structure. So I may choose to separatate page_handlers.js
into page_handlers/foo.js
and page_handlers/bar.js
. The trick is to use proper namespacing that will allow you to refactor, extend, share code easily.
It really depends on what you prefer but I would do what nico says. (All in one file for functionality that is used on the whole website. Or split functionality for each page.) Loading many JavaScript files on one page increases HTTP traffic.
I don't know if exists a standard about that, but maybe big projects like jQuery, Dojo, YUI Library (by Yahoo!) etc. could show you some good practices. I particularly do everything Object Oriented in JavaScript, so I am used to separate each class in different js files, and after I use the "cat" to put everything together and then YUI Compressor to minify. I'm sorry for this incomplete answer, I also will keep watching this thread!
It really depends on what you're doing.
If each page has completely different functionality then it might make sense to break the functions into different files per page. If you have some reuse then you might put common functions in a util class. You might try to make everything object oriented (my personal approach).
So basically I would say do what makes sense to you.
精彩评论