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

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

2 голосов
/ 11 мая 2010

Когда JavaScript оценивает функцию? Это при загрузке страницы или когда вызывается функция?

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

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* функциях даже до того, как эти функции были вызваны. Это правильно? Или я неправильно понимаю, что не так с моим кодом?

Ответы [ 2 ]

5 голосов
/ 11 мая 2010

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

Например 

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

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

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

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

Редактировать

В настоящее время ваш сайт отключается от меня, когда вы присоединяете загруженный <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 голосов
/ 11 мая 2010

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

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

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...