$(document).ready() or $(function()) -- Which to use?

Question

I saw there is an answered question about whether there is a difference between using $(document).ready(function(){}) and $(function(){}) (there isn't), but my question is which is the preferred syntax and why.

I've been using jQuery for about a year and have always used the $(document).ready() syntax; but lately on SO and in some other places, I've seen the $(function()) syntax used more and more.

Is there a preferred syntax that you use and why do you use it? Do you use the shorter syntax solely to save a few characters?

Just a little more background, I'm currently starting a new app from the ground up and want to put some generally accepted best practices and standards in place.

Thanks in advance!

Answer 1

You can use either, $(function() {}) is just a shortcut that does exactly the same thing.

Personally, I prefer $(function() { }) because...well, I type it a lot, and it's much quicker.

I see a lot of questions of why $(document).load() doesn't work and such because they're not using the right event...I also think$(func) takes some ambiguity out, to me. Do whichever you prefer, what's clearer to you and your team is the best choice here.

Answer 2

I find that $(function() {}); is just simpler and saves a few characters. Like you said, it doesn't matter. I think the more important things to worry about are your design patterns for your javascript. They can impact performance, readability, and simplicity.

Answer 3

I use $(document).ready(function(){}); despite the additional typing. I just prefer having that in my code to remind me exactly when the code is going to run, and for the ability to search for 'ready' to find those sections. It's the same functionality, and I normally take shortcuts, but in this case I don't.

Answer 4

I believe the authors of jQuery recommend using $(document).ready(function(){...}); since it makes your code more transparent.