jQuery里的$(function())为什么会改变执行顺序？

Question

网页代码块如下：

...<script src="./js/main.js"></script><script>
    try {      window.RenderModel = {{ data|safe }};
    } catch (e) {
    }</script>...

后面这段内嵌代码是在页面加载是由后端(django)补全，传进来一些重要的参数。
然后，我的main.js里有这样一个变量：

var hasServer = typeof (window.RenderModel) !== 'undefined'

这个变量通过判断window.RenderModel是否存在来检测当前是否有服务器环境。
现在有一个小问题，虽然说可以解决，但是不明白其中的原理，所以请教一下各位高手。
当hasServer这个变量在main.js里直接声明时，无论是否在服务器环境，window.RenderModel都被检测为undefined，因为main.js在内嵌代码前面执行，这一点是很显然的。但是，如果我将hasServer的声明放置在一个$(function())中，如这样：

$(function() {    var hasServer = typeof (window.RenderModel) !== 'undefined'
    ...
});

这个时候hasServer就可以正常判断`window.RenderModel了，产生这种区别的原因是什么？

Answer 1

$(function() {     doOtherThings(); }); doSomething();这段代码，你也许是觉得 doOtherThings() 会先执行，但实际是 doSomthing() 先执行。因为 $() 实际是 $(document).ready() 的简写，也就是说 $() 中的 function 是 document.ready 事件的回调函数。它要在 document 准备好了（加载完了）才执行。很显示，在到达当前 HTML 最后一句之前，文档都还没准备好，而写在 $() 外面的代码，是遇到即执行。所以 doOtherThings() 是在执行 doSomehting() 之前注册到 ready 事件中，但执行却在 doSomething() 之后。