의 모듈 개념
AMD는 추진 과정에서 정의 requirejs 표준화 된 모듈 출력됩니다.
비동기로드 모듈, 전면 좌우 미리 수행
정의 모듈 (함수 () {} 복귀 [ '갑'을 '이 필요한'])을 정의 정의;
로딩 모듈 (전후 좌우) 요구 ([ '갑'이 필요한 '바 '], 함수 (foo에, 바) {})
CMD를 승격 프로세스에서 정의 출력 SeaJS 표준 모듈이다.
정의 수출 (기능 (필요 수출 정의 유래 정의 ; 모듈) {})
현재 모듈 모듈 객체의 일부를 저장한다.
필요 (./ A) require.async 비동기 도입 직접 소개
가장 가까운 지연 실행에 의존 동기 부하
가 유사한 CommonjsModule / 2.0 사양
AMD 모듈 코드를
//index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script data-main="js/main.js" src="./js/require.js"></script>
</head>
<body>
<script>
</script>
</body>
</html>
//main.js
define(['require','main'],function(require){
require(['index','test'],function(index,test){
console.log(index());
console.log(test());
})
})
//index.js
define(['require','index'],function(require){
var index = function(){
console.log('test index');
}
return index;
})
//test.js
define(['require','index'],function(require){
var init = function(){
console.log('test init');
}
return init;
})
메소드 호출
//index.js
define(['require','index'],function(require){
var index = {};
var index = {
init:function(){
console.log('test init');
}
}
return index;
})
//main.js
define(['require','main'],function(require){
require(['index','test'],function(index,test){
console.log(index.init());
console.log(test.init());
})
})
//test.js
define(['require','index'],function(require){
var index = {};
var index = {
init:function(){
console.log('test init');
}
}
return index;
})
효과
seajs 응용 프로그램
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script src="./js/sea.js"></script>
</head>
<body>
<script>
// seajs 的简单配置
seajs.config({
base: "./js/",
alias: {
"jquery": "jquery.js"
}
})
// 加载入口模块
seajs.use("main")
</script>
</body>
</html>
//index.js
define(function(require,exports,module){
// 透过exports对外提供接口
// exports.doSomething = function(){
// console.log('my ok ');
// }
// exports.doSomething2 = function(){
// console.log('my ok2 ');
// }
var a = {};
a.doSomething = function(){
console.log('my ok ');
}
a.doSomething2 = function(){
console.log('my ok2 ');
}
// console.log(module);
module.exports = a;
});
//main.js
define(function(require,exports,module){
require('jquery');
console.log('..aaa');
var index =require.async('index',function(index){
console.log(index);
});
})
전면에서이 문서에서는 자바 스크립트 라이브러리와 유틸리티 모듈 비디오의 일반적으로 사용되는 기술을 볼 수