require 와 import 및 exports 와 export 의 차이 점 및 사용

여기 서 우리 가 토론 하고 자 하 는 모듈 은 node. js 에서 사용 하 는 CommonJS 규범 과 es6 의 모듈 이 다르다.
어 지 럽 게 썼 으 니 먼저 기록 하 세 요.
1. CommonJS 규범
CommonJS 규범 에 따 르 면 각 모듈 내부 에 하나의 module 대상 {} 이 현재 모듈 을 대표 합 니 다.그것 의 exports 속성 (즉, module. exports) 은 대외 인터페이스 입 니 다.
모듈 을 불 러 옵 니 다. 사실은 이 모듈 을 불 러 오 는 module. exports 속성 입 니 다.exports 는 module. exports 의 인용 으로 module. exports 에 내용 을 추가 하 는 것 을 보조 합 니 다. exports 는 module. exports 를 가리 키 는데 이것 은 각 모듈 의 머리 에 있 는 명령 과 같 습 니 다.var exports = module.exports;
따라서 우 리 는 exports. xxx = "..." 를 직접 사용 할 수 있다.
exports 변 수 를 하나의 값 으로 직접 가리 킬 수 없습니다. 이것 은 exports 와 module. exports 의 관 계 를 차단 하 는 것 과 같 기 때 문 입 니 다.
그럼, 우 리 는 언제 exports 를 사용 합 니까?언제 module. exports 를 사용 합 니까?
하나의 모듈 이 특정 유형의 단일 구성원 을 내 보 내야 할 때, 예 를 들 어 배열, 방법 등 은 이 럴 때 module. exports 방법 을 사용 해 야 하 며, exports 는 하나의 object 대상 만 되 돌려 줄 수 있 습 니 다.
require 는 module. exports 출력 을 가 져 오 는 모듈 내용 입 니 다. node 의 개인 적 인 전역 방법 으로 동기 화 로드 에 속 합 니 다.AMD 규범 에 기초 하 다.node. js 는 CommonJS 규범 을 바탕 으로 합 니 다.AMD 는 CommonJS 와 사용 에 있어 서 매우 비슷 하 다.
2. es6 모듈
ES6 모듈 은 대상 이 아니 라 export 명령 을 통 해 출력 되 는 코드 입 니 다.저 희 는 node 에서 babel 을 사용 하여 ES6 를 지원 합 니 다. ES6 를 ES5 로 바 꾸 고 실행 합 니 다. 현재 node 에서 import 를 사용 하면 require 로 바 뀝 니 다.
import 는 es6 의 문법 기준 으로 export 에 대응 합 니 다.
require 와 import 는 모두 모듈 을 가 져 오 는 데 사 용 됩 니 다.
둘 의 차 이 는 다음 과 같다.
모듈 의 로 딩 시간 이 다 릅 니 다:
require 는 실행 할 때 불 러 오고 import 는 컴 파일 할 때 불 러 옵 니 다.따라서 require 는 코드 의 임의의 위치 에 쓸 수 있 고 import 는 파일 의 맨 위 에 써 야 합 니 다.
모듈 의 본질:
require 는 할당 과정 입 니 다. module. exports 의 전송 문 에 해당 합 니 다. module. exports 뒤의 내용 이 무엇 입 니까? require 의 결 과 는 무엇 입 니까? 대상, 숫자, 문자열, 함수.
사용 방법 은 다음 과 같다.

    ：
a.js:
module.exports={
    a:function(){
      ......
    },
url:"      "
}
    ：
b.js:
var obj = require('./a);
obj.a();
console.log(obj.url);

require 로 es6 기본 내 보 내기 (export default my component) 모듈 을 불 러 오 려 면 require ('...'). default 를 사용 해 야 합 니 다.주요 원인 은 node 에서 es6 모듈 을 처리 할 때 내 보 낸 모듈 형식 을 불 러 오 는 것 입 니 다.

{
 default:mycomponent
}

import 는 재 구성 과정 이 며 ES6 모듈 은 대상 이 아 닌 export 명령 을 통 해 출력 되 는 코드 입 니 다.저 희 는 node 에서 babel 을 사용 하여 ES6 를 지원 합 니 다. ES6 를 ES5 로 바 꾸 고 실행 합 니 다. 현재 node 에서 import 를 사용 하면 require 로 바 뀝 니 다.
import 를 사용 하려 면 export 에 관 한 지식 이 필요 합 니 다.
export 문 구 는 모듈 에서 함수, 대상 또는 원시 값 을 내 보 내 고 다른 프로그램 이 import 문 구 를 통 해 사용 할 수 있 도록 합 니 다.
엄격 한 모드 를 설명 하 든 말 든 내 보 내 는 모듈 은 엄격 한 모드 에 있 습 니 다.
내 보 내기 와 기본 내 보 내기 라 는 두 가지 내 보 내기 방식 이 있 습 니 다.모든 모듈 에서 여러 개의 이름 내 보 내기 를 정의 할 수 있 지만 기본 내 보 내기 만 허용 합 니 다.
이름 내 보 내기: 가 져 올 때 같은 이름 을 사용 해 야 합 니 다.

a.js ：
//         
export { myFunction }; 

//       
export const foo = Math.sqrt(9);//         

//      
//    
export var m = 1;

//    
var m = 1;
export {m};

//    
var n = 1;
export {n as m};


//        ：
b.js ：
import {myFunction,foo,m} from "./a";
console.log(myFunction());
console.log(foo);//  3

기본 내 보 내기: 기본 내 보 내기 가 져 올 때 내 보 낼 이름 과 일치 하지 않 아 도 됩 니 다.

a.js ：
//    
export default function() {}
//   
export default class A{......}
 ：                    

b.js   ：
import funM from './a';
import A from './a';

 
주의  var 、 let  혹시  const  기본 값 내 보 내기  export default 。
따라서 변 수 를 내 보 내 려 면 다음 과 같이 쓰 십시오.

var a=1;//     

export default a;

아래 의 이 쓰 기 는 잘못된 것 입 니 다: export default var a = 1.
본질 적 으로 a. js 파일 의 export default 은 default 라 는 변 수 를 출력 한 다음 시스템 에서 임의의 이름 을 지 을 수 있 도록 합 니 다.
따라서 export 기본 값 에 대해 서 는:

export default function (){}

   ：

var function a(){...}

export {a as default}

가 져 올 때:

import a from './x';
   ：
import {default as a} from './x';

export 구문 출력 인터페이스 와 대응 하 는 값 은 동적 바 인 딩 관계 입 니 다. 즉, 이 인 터 페 이 스 를 통 해 모듈 내부 의 실시 간 값 을 얻 을 수 있 습 니 다.comonjs 와 달리 import 명령 은 향상 효과 가 있 으 며 전체 모듈 의 머리 로 올 라 가 먼저 실 행 됩 니 다.import 는 컴 파일 할 때 실행 되 기 때 문 입 니 다.
ES6 모듈 의 디자인 사상 은 가능 한 한 정적 화 되 어 컴 파일 할 때 모듈 의 의존 관계 와 입력 과 출력의 변수, 즉 '컴 파일 할 때 불 러 오기' 나 정적 불 러 오기 '를 확정 할 수 있 도록 하 는 것 이다.CommonJS 와 AMD 모듈 은 모두 실행 할 때 만 이 물건 들 을 확인 할 수 있 습 니 다. 즉, '실행 할 때 불 러 오기' 입 니 다.