2011-02-06 2 views
7

그냥 궁금해서 ...JavaScript 파일로드 순서 및 종속성 관리

나는 모듈 패턴을 기반으로하는 코드를 포함하는 여러 개의 자바 스크립트 파일을 가지고 있습니다. 일부 모듈은 다른 모듈들 중 일부를 종속 요소로 가지고 있습니다. 페이지가로드 될 때까지 HTML에서 코드를 호출하지 않는다는 것을 안다면 파일로드 순서가 여전히 중요합니까?

모듈 코드가 다른 모듈을 이미로드해야한다는 요구 사항을 트리거하기에 충분한 즉각적인 함수 안에 있다고 생각합니까?

필요하면 RequireJS 라이브러리를 살펴볼 준비가되었지만, 내가 무엇을 할 것인지 먼저 확인하는 것이 좋습니다.

답변

8

가능하면 자바 스크립트 파일로드시 (즉 자동 실행 기능 사용) 모든 모듈을로드하고 설정할 수 있도록 종속성을 설정하십시오.

그런 다음 블록의 모든 모듈에서 .init 또는 동등한 기능을 호출하십시오. 그렇게하면 모든 파일이로드 된 후에 종속성이 필요한 기능을 명시 적으로 호출 할 수 있습니다.

예 :

foo.js 
(function() { 
    function initFoo() { ... } 
    ... 
    window.namespace.foo = { 
     init: initFoo 
    } 
}()); 

bar.js 
(function() { 
    function initBar() { ... } 
    ... 
    window.namespace.bar = { 
     bar: initBar 
    } 
}()); 

main.js 
(function() { 
    $.ready(function() { 
      window.namespace.foo.init(); 
      window.namespace.bar.bar(); // dependancies on foo 
    }); 

}()); 

의존성이 모든 파일을로드 한 후 .readyinit 기능을 통해 호출 할 수 있습니다 foo.js & bar.js의 폐쇄 및 종속 코드를 실행할 수 있습니다 나던 코드.

+0

제안을 주셔서 감사합니다.하지만 더 많은 조사와 고려를 한 후에는 RequireJS 솔루션을 사용할 것입니다. –

+0

@JasonMiesionczek 나는 RequireJS 솔루션이 내가 좋아하는 부분이 무겁다 고 생각한다. 또한 그것은 내 코드를 추악하게 만듭니다! 독립적 인 코드가 즉시로드되고 종속 코드가 수동으로 시작되도록 코드를 설계하는 것을 선호합니다. 말도 안되는 순환 의존성이 없다면 코드는 괜찮을 것입니다. – Raynos

+0

내 문제는, 나는 훨씬 더 어려운 내 자신의 솔루션을 설계하게 순환 종속성이있다. –

1

실행이 시작될 때까지 모든 파일이로드 된 경우 로딩 순서는 중요하지 않습니다.

그것은 일부 자바 스크립트 엔진이 즉시 다운로드 될 때 스크립트를 컴파일하기 시작하므로이 이 영향을 미칠 수있는 가능성이있을 수 있습니다. 그러나 스크립트는 여전히 실행됩니다!