jquery에서 초기화를위한 익명 함수 대 별도의 명명 된 함수

페이지가로드 될 때 초기화하는 데 사용되는 코드가 있다고 가정 해 보겠습니다.

function initStuff() { ...}
...
$(document).ready(initStuff);

initStuff 함수는 스 니펫의 세 번째 라인에서만 호출됩니다. 다시는 따라서 일반적으로 사람들은 이것을 다음과 같이 익명의 콜백에 넣습니다.

$(document).ready(function() { 
    //Body of initStuff
});

ready ()를 호출하면 이것이 초기화 코드임을 알 수 있기 때문에 코드의 전용 위치에 함수를 갖는 것이 실제로 가독성을 높이는 데 도움이되지는 않습니다.

다른 것을 선호하는 다른 이유가 있습니까?

@ Stargazer712에서 언급했듯이 첫 번째는 글로벌 네임 스페이스를 어지럽히므로 두 번째는 네임 스페이스 IMHO입니다. 이제 두 번째 예제에서 익명 함수를 사용하기 때문에 디버거의 콜 스택은 쓸모가 없으며 사용하는 디버거에 따라 다른 결과를 얻습니다. 일반적으로 내가 끝내는 것은 다음과 같습니다.

$(document).ready(function MODULE_init() { 
    //Body of initStuff
});

이렇게하면 전역 네임 스페이스가 복잡하지 않고 유용한 콜 스택이 있습니다.

나는 모든 익명 (더 이상 익명이 아니라;) 함수 정의에서 위의 규칙을 사용하는 경향이 있습니다. Firefox JS 코드를 탐색 할 때 찾은 규칙입니다.

편집 : 이제 올리버는 단위 테스트로 좋은 점을 제시합니다. 위의 내용은 테스트되지 않은 많은 코드를 수용하지 않고 더 복잡한 작업을위한 래퍼 역할을합니다.

이 경우에는 문제가되지 않지만 익명의 콜백 함수가 있고 다른 익명의 콜백 함수를 호출하는 경우 코드를 훨씬 더 읽기 쉽고 따르기 쉽게 만드는 첫 번째 방법을 사용하는 경향이 있습니다.

단위 테스트와 관련하여 initstuff기능을 독립적 으로 테스트 할 수 있으므로 첫 번째 방법이 더 좋습니다 .

첫 번째로 가독성 / 디버깅 / 테스트 등을하겠습니다. 페이지의 모든 함수에 대해 로컬 네임 스페이스를 만들면 전역 네임 스페이스 혼란 문제를 피할 수 있습니다. Paul Irish가 권장 한대로 객체 표기법을 사용합니다 ( http://paulirish.com/2009/perf/의 슬라이드 13-15 참조 ).

var MYPAGE = {
  onReady : function(){
  // init code
  },
  someOtherCallback : function(){}
};

jQuery(document).ready(MYPAGE.onReady);

내가 선호하는 전역 네임 스페이스를 어지럽히 지 않고 init 메소드를 등록하는 세 번째 방법이 있습니다.

jQuery(function(){....});

짧고 DOM 문서 조회를 피합니다.

jQuery(document).ready(function(){...}); 

그렇습니다.