>웹 프론트엔드 >JS 튜토리얼 >node(1)의 모듈 사양을 0부터 1까지 학습합니다.

node(1)의 모듈 사양을 0부터 1까지 학습합니다.

大家讲道理
大家讲道理원래의
2017-01-24 15:30:511209검색

CommonJS, AMD, CMD의 개념을 설명하기 전에 먼저 js의 모듈성에 대해 이해해야 합니다. 모듈화는 이름에서 알 수 있듯이 기능이나 기타 논리에 따라 프로젝트를 분해하는 것입니다. 각 부분은 하나의 기능만 처리하여 기능을 분리하여 향후 개발 및 유지 관리를 용이하게 합니다. 그런 다음 모듈화에는 모듈을 분할하고 조립하기 위한 다음 기능이 있어야 합니다.

  1. 캡슐화된 모듈 정의

  2. 의존성을 정의합니다.

  3. 다른 모듈의 도입을 지원할 수 있습니다.

그런 다음 일련의 사양이 사용되었습니다. 이러한 기능을 정의하기 위해 CommonJS, AMD, CMD 등이 등장했습니다.

1. CommonJS

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를 지정합니다. 동일한 결과를 출력합니다.

  1. b의 이름이 변경되고 a의 이름도 변경됩니다.

  2. b 개체가 다시 선언됩니다. , 그러면 a의 이름은 b와 함께 변경되지 않습니다

  3. 설명
  4. : a는 객체이고 b는 a의 쌍입니다. 참조, 즉 a b는 동일한 메모리를 가리키므로 1의 출력은 동일합니다. b가 수정되면, 즉 동일한 메모리 주소를 가리키는 a와 b의 내용이 변경되면 a도 반영되므로 두 번째 예의 출력은 동일하게 됩니다. b를 덮어쓰면 b는 새 메모리를 가리키고, still은 원래 메모리를 가리키므로 최종 출력은 달라집니다.

그러면 이때 을 소개할 수 있습니다.

exportsmodule.exportsmodule.exports의 초기 값은 빈 객체입니다. {}

  1. exports는 module.exports에 대한 참조입니다

  2. require()는 내보내기 대신 module.exports를 반환합니다

  3. module.exports에 새 포인터가 있으면 내보내기가 유효하지 않습니다. module.exports가 변경되지 않은 경우 직접 내보내세요.

  4. 2. AMD와 RequireJS

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 및 seajs

defineCMD 사양은 중국의 유명한 Yu Bo가 제안한 것으로

만 하면 됩니다. 그 곳에서

. SeaJS는 CMD 사양을 사용합니다:

// 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의 논리를 기반으로 합니다.

4. 요약

이 문서에서는 CommonJS, AMD 및 CMD 사양 간의 관련 차이점과 연관성을 소개합니다.

  1. CommonJS: 각 파일은 모듈이므로 정의할 필요가 없습니다.

  2. AMD: 정의를 사용하여 모듈을 정의하고 사전에;

  3. CMD: Define을 사용하여 모듈을 정의하고 nearby

에 의존합니다. will start 노드 학습이 공식적으로 시작됩니다.


성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.