Определение функций в Javascript в jQuery

Question

Я работаю на частном сайте, и у меня возникли некоторые проблемы.Я использую jQuery вместе с прототипом, и у меня есть правильное пространство имен, поэтому в этом вопросе предположим, что вы можете использовать $ или jQ как ссылку на пространство имен для jQuery.

Итак, у меня есть кучафункции, некоторые смешивают jQuery и javascript, некоторые простые javascript, некоторые только jQuery.Теперь, в настоящее время некоторые функции определены в функции jQuery document.ready, а некоторые определены вне ее, примерно так:

jQ(document.ready(function($) {

  if ( ifConfig ) {
    //page check, function calls here
    fnc1();
    fnc2();
    fnc3();
    fnc4();
  }

  function fnc1() {
    //fnc code in here
  }
  function fnc2() {
    //fnc code in here
  }
});  //end document.ready

function fnc3() {
}
function fnc4() {
}

Теперь это весь псевдокод, можно предположить, что функциидействительный и имеет действительный код в них.Недавно я выполнял некоторую отладку, и одна из моих функций, которая была объявлена ​​и вызвана внутри документа. Уже сказала, что она не определена.Я переместил его за пределы документа. Уже, и все снова заработало.

Я в основном пытаюсь понять порядок лучшего вызова / вызова функций, поэтому у меня вопрос, когда вы объявляете функции внутриdocument.ready и когда вы объявляете их на улице?Вы только декларируете внутри, когда они вызваны в том документе. Уже только?Или я всегда должен объявлять их вне этого документа. Уже?

Спасибо.

Answer 1

Как правило, вы должны объявить и определить свой собственный namespace, где находится вся логика вашего приложения (включая функции / методы).Таким образом, вы избегаете collision с другими сценариями на вашем сайте + таким образом, ваш код становится намного чище и проще для обслуживания.

var myapp = function(){
    var foobar1 = null,
        foobar2 = null,
        foobar3 = null;

    return {
        getFoobar1:  function(){
           return foobar1;
        },
        getFoobar2:  function(){
           return foobar2;
        },
        setFoobar1:  function(foo){
           foobar1 = foo;
        },
        clickhandler: function(e){
           alert('I am an event handler, and I am not anonymous');
        }
        // etc.
    };
};

$(document).ready(function(){
    var Application = myapp();

    Application.getFoobar2();

    $(document).bind('click', Application.clickhandler);
});

Этот шаблон (некоторые называют его «шаблоном метода») создает закрытый кодфункция / объект, которая также гарантирует закрытые переменные-члены в вашем пространстве имен, доступные только через функции getter извне.

Это на самом деле лишь довольно простой пример, вы можете расширить эту идею и шаблонЭто очень хорошая и хорошая вещь (IMO).

Отличная книга об этом материале, которая часто и называлась и рекомендовалась, - «Javascript: The Good Parts» Дугласа Крокфорда.

Answer 2

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

Answer 3

(документ) .ready больше используется для вещей, которые должны выполняться при загрузке страницы, а не для объявлений функций.Если вы объявите их внутри (document) .ready, их область будет локальной для этого блока - если они используются только локально, это нормально, и их следует объявить там.В противном случае объявите их снаружи.

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