2010-05-11 2 views
2

Когда JavaScript оценивает функцию? Нагрузка на страницу или когда вызывается функция?JavaScript: Когда JavaScript оценивает функцию, onload или когда функция вызывается?

Причина, почему я спрашиваю, потому что у меня есть следующий код:

function scriptLoaded() { 
    // one of our scripts finished loading, detect which scripts are available: 
    var jQuery = window.jQuery; 
    var maps = window.google && google.maps; 

    if (maps && !requiresGmaps.called) { 
    requiresGmaps.called = true; 
    requiresGmaps(); 
    } 
    if (jQuery && !requiresJQuery.called) { 
    requiresJQuery.called = true; 
    requiresJQuery(); 
    } 
    if (maps && jQuery && !requiresBothJQueryGmaps.called) { 
    requiresBothJQueryGmaps.called = true; 
    requiresBothJQueryGmaps(); 
    } 
} 
// asynch download of script 
function addScript(url) { 
    var script = document.createElement('script'); 
    script.src = url; 
    // older IE... 
    script.onreadystatechange=function() { 
     if (this.readyState == 'complete') scriptLoaded.call(this); 
    } 
    script.onload=scriptLoaded; 

    document.getElementsByTagName('head')[0].appendChild(script); 
} 

addScript('http://google.com/gmaps.js'); 
addScript('http://jquery.com/jquery.js'); 

// define some function dependecies 
function requiresJQuery() { // create JQuery objects } 
function requiresGmaps() { // create Google Maps object, etc } 
function requiresBothJQueryGmaps() { ... } 

То, что я хочу сделать, это выполнить Асинхронный загрузку моего JavaScript и начать в кратчайшие сроки начать выполнение этих сценариев но мой код имеет зависимости от того, когда скрипт был загружен и загружен.

Когда я пытаюсь выполнить код выше, кажется, что мой браузер все еще пытается оценить код в моих require* функциях еще до того, как эти функции были вызваны. Это верно? Или я не понимаю, что случилось с моим кодом?

+1

Этот вопрос имеет значение только для того, чтобы вы были достаточно мудры, чтобы поместить свой JavaScript во внешний файл из вашей разметки. Если вам не хватает такой мудрости, тогда вам следует ожидать неопределенности и хаоса. – 2010-05-11 16:30:54

ответ

5

Функции оцениваются при вызове.

Например

function test() { 
    window.foo = 'bar'; 
} 

console.log(window.foo); // => undefined 
test(); 
console.log(window.foo); // => bar 

Даже если test был создан до первого console.log, window.foo не не заполняется до test на самом деле называется.

Если requires* функции висит/блокировки, то вам нужно показать код для тех, кто (почему бы не обеспечить источник для проблемных из них?)

Edit:

В настоящее время, ваш сайт гаснет, когда вы присоединяете загруженный <script> к <head>.

В любом случае, быстрое исправление должно заключаться в том, чтобы разместить сценарии, которые вы хотите, в нижней части страницы, до </body>, поскольку только сценарии в <head> полностью блокируют страницу во время загрузки.

Есть некоторые элегантные способы поздней загрузки ресурсов, но, чтобы держать его просто ..

<script type="text/javascript" src="http://path/to/jquery.js"></script> 
<script type="text/javascript"> 
requiresJQuery(); // jQuery is available at this point 
</script> 
</body> 

Дело в том, что, так как <script> помещается после ваших основных элементов DOM-элементы будут доступный (и потенциально загруженный), прежде чем браузер начнет загружать ваши другие библиотеки.

+0

@Matt, я связался с живым сайтом в оригинальной почте сейчас. См. Обновление. – Benj

+0

@Matt, также - я в основном ищу способы ускорить загрузку своего веб-сайта, и большой, который я заметил, это то, что JS блокирует. Вы можете увидеть мой сайт в /.То, что я пытаюсь сделать со связанной страницей html, - это переделать мою главную страницу, чтобы удалить наследование JS-блокировки для выполнения более ранней обработки JS, если это возможно (если это имеет смысл) – Benj

+0

@Benj см. Мое обновление – Matt

0

Да, вы, вероятно, недоразумение. Даже если ваши функции содержат синтаксическую ошибку, это не имеет значения, пока вы фактически не вызовите функцию.

Возможно, вы вызываете эти функции из другого места? Возможно, вы не предоставили точные образцы кода?

+0

Я связался с сайтом в прямом эфире прямо сейчас. См. Обновление. – Benj

+0

Я не вижу ссылку на исходный сайт. Вы уже удалили его? –

Смежные вопросы