Javascript의 include/require_javascript 기술 사용에 대한 간략한 분석

1. javascript include
include 문이 없는 Javascript는 특히 스크립트 간에 종속 관계가 있고 이를 전혀 동적으로 제어할 수 없기 때문에 짜증나는 경우가 있습니다. 일반적으로 가장 간단한 include는 기본적으로 다음과 같습니다. 물론 jQuery를 사용하여 스크립트를 요청합니다.

코드 복사 코드는 다음과 같습니다.

include: function (jsurl) {
if (jsurl == null || typeof(jsurl) != 'string') return;
var js = document.createElement('script');
js.type = 'text/javascript';
js.charset = 'utf-8';
js.src = jsurl;
$. ajaxSetup ({ 캐시 : true });
                                                                                                                    >
기본 사용법

함수는 실제로 GET 요청을 보내는데, 이는 jQuery.ajax의 getScript()로 처리되는데, GET 이후의 처리가 $.getScript()와 다르기 때문에 사용 방법도 달라지게 됩니다. getScript()는 일반적으로 다음과 같은 종속 함수를 콜백 함수에 작성해야 합니다. $.getScript('some.js', function() { // some.js 파일에 의존하는 작업을 수행합니다.});

그리고 여기에 포함할 내용을 다음과 같이 작성할 필요는 없지만 직접적으로 다음과 같이 작성할 수 있습니다.

include('some.js');

//여기서 some.js 파일에 정의된 함수에 대한 종속성을 직접 작성할 수 있습니다

캐싱 활성화

파일 캐싱에 대한 또 다른 점은 기본적으로 $.getScript가 URL 뒤에 타임스탬프를 추가하므로 브라우저가 두 번째 요청 중에 캐시된 파일을 읽을 수 없게 된다는 것입니다. "), 그리고 최종적으로 요청할 때 GET some.js?_23432434534235 등이 됩니다. 이는 캐싱을 강제하지 않는 전략입니다. 개발 단계에서는 더 좋지만 제작 단계에서는 사용자가 브라우저를 js 스크립트를 매번 캐시하지 않으므로 효율성에 큰 영향을 미칩니다. 매번 타임스탬프를 변경하는 대신 some.js?v=1과 같이 js 스크립트 뒤에 버전 스탬프를 추가해야 합니다. 사용해야 합니다: $.ajaxSetup({ 캐시 : true }); 이렇게 하면 URL에 타임스탬프를 자동으로 추가하는 jQuery의 기능이 꺼집니다.

requireJs

스크립트에 상호 의존성이 많고 로드할 스크립트를 동적으로 결정해야 하는 경우 requirejs를 사용하는 것이 좋습니다. 기본 사용법은 다음과 같습니다.

require(["some/module", "a.js", "b.js"], function(someModule) { // 작업 수행}); 한 가지 요구 사항은 프런트엔드 JS를 모듈로 개발해야 한다는 것입니다. 프런트엔드 로직이 상대적으로 복잡하다면 프런트엔드 개발에 모듈을 사용하는 것이 좋은 선택이 될 것입니다. 앞으로의 기사에서 좀 더 구체적으로 이야기해 보겠습니다. 이 부분에 관심이 있으시면

requireJs

공식 웹사이트를 방문해 보세요.