CommonJS, AMD, CMD의 개념을 설명하기 전에 먼저 js의 모듈성에 대해 이해해야 합니다. 모듈화는 이름에서 알 수 있듯이 기능이나 기타 논리에 따라 프로젝트를 분해하는 것입니다. 각 부분은 하나의 기능만 처리하여 기능을 분리하여 향후 개발 및 유지 관리를 용이하게 합니다. 그런 다음 모듈화에는 모듈을 분할하고 조립하기 위한 다음 기능이 있어야 합니다.
캡슐화된 모듈 정의
의존성을 정의합니다.
다른 모듈의 도입을 지원할 수 있습니다.
그런 다음 일련의 사양이 사용되었습니다. 이러한 기능을 정의하기 위해 CommonJS, AMD, CMD 등이 등장했습니다.
CommonJS는 원래 ServerJS
라고 불렸는데, 이는 서버 측의 js 사양입니다. CommonJS 사양에 따르면 단일 파일은 모듈이고 require
은 모듈을 로드하는 데 사용되고 exports
은 모듈 내의 메서드나 속성을 외부에 노출하는 데 사용됩니다.
예:
// hello.jsfunction say(username){ console.log( 'hello, '+username );
}
exports.say = say;
==============
// main.jsvar person = require('./hello');
person.say('wenzi'); // hello, wenziperson.say('师少兵'); // hello, 师少兵person.say('NUC'); // hello, NUC
동시에, require
문은 파일의 어느 곳에나 쓸 수 있으며, 사용하기 전에 인용만 하면 파일 앞에 쓸 필요는 없습니다. 그러나 코드를 읽기 쉽게 만들고 현재 어떤 모듈이 참조되고 있는지 직관적으로 확인하려면 파일 앞에 두는 것이 가장 좋습니다.
var a = {name:'wenzi'};var b = a;console.log(a); // {name: "wenzi"}console.log(b); // {name: "wenzi"}
a와 b의 출력 결과는 동일합니다. 이제 b의 name 값을 변경합니다.
b.name = 'shaobing';console.log(a); // {name: "shaobing"}console.log(b); // {name: "shaobing"}
a와 b의 출력 결과가 모두 변경되었습니다. 나는 b를 다시 선언합니다:
var b = {name:'师少兵'};console.log(a); // {name: "shaobing"}console.log(b); // {name: "师少兵"}
이 세 가지 예는 세 가지 결과를 출력합니다:
객체를 선언하고 a를 b에 할당한 다음 a와 b를 지정합니다. 동일한 결과를 출력합니다.
b의 이름이 변경되고 a의 이름도 변경됩니다.
b 개체가 다시 선언됩니다. , 그러면 a의 이름은 b와 함께 변경되지 않습니다
그러면 이때 및 을 소개할 수 있습니다.
exports
module.exports
module.exports의 초기 값은 빈 객체입니다. {}
exports는 module.exports에 대한 참조입니다
require()는 내보내기 대신 module.exports를 반환합니다
module.exports에 새 포인터가 있으면 내보내기가 유효하지 않습니다. module.exports가 변경되지 않은 경우 직접 내보내세요.
AMD라고 하면
AMD가 CommonJS 커뮤니티에서 독립하여 단독으로 AMD 커뮤니티가 된 것은 AMD의 인기에 크게 기인합니다. 또한 RequireJS 작성자의 홍보에 의존합니다. AMD 사양에서 기본 권장 모듈 형식은RequireJS
// hello.js// 将需要引入的模块全部写入到数组中,然后传递参数进行调用define(['a', 'b'], function(a, ,b){ // do something return{ hello : function(username){ console.log( 'hello, '+username ); } } })
==========
// main.jsdefine(['./hello'], function(h){
h.hello('wenzi');
})
즉, AMD에서는
을 사용하여 모듈을 정의해야 하며, 종속성은 함수 매개변수를 통해 전달됩니다. 이것의 장점 중 하나는 모든 종속성을 한눈에 볼 수 있다는 것입니다. 3. CMD 및 seajsdefine
CMD 사양은 중국의 유명한 Yu Bo가 제안한 것으로
// hello.jsdefine(function(require, exports, module){ var a = require('a'); // do a var b = require( 'b' ); // do b module.exports.hello = hello; // 对外输出hello})
就近依赖
여기에서 AMD와 CMD의 차이점도 확인할 수 있습니다.
AMD는 일반적으로 모든 종속성을 한 번에 도입한 다음 매개변수를 통해 전달해야 하지만 CMD는 필요할 때만 도입합니다.
그러나 AMD는 CMD와 같은 가져오기 형식도 지원하지만 내부 실행은 여전히 AMD의 논리를 기반으로 합니다.
이 문서에서는 CommonJS, AMD 및 CMD 사양 간의 관련 차이점과 연관성을 소개합니다.
CommonJS: 각 파일은 모듈이므로 정의할 필요가 없습니다.
AMD: 정의를 사용하여 모듈을 정의하고 사전에;
CMD: Define을 사용하여 모듈을 정의하고 nearby
에 의존합니다. will start 노드 학습이 공식적으로 시작됩니다.