node.js에서 가져오기 및 내보내기를 사용하는 방법-JS 튜토리얼-php.cn

node.js에서 가져오기 및 내보내기를 사용하는 방법

小云云

풀어 주다： 2018-01-30 09:47:22

원래의

1848명이 탐색했습니다.

가져오기 및 내보내기는 es6의 모듈식 가져오기 및 내보내기이며, 현 단계에서는 node.js에서 지원하지 않습니다. 이를 node.js의 모듈식 코드로 변환하려면 babel을 통해 컴파일해야 합니다. (node.js 모듈에 대해서는 다른 node.js 모듈 문서를 참고하세요.) 이 글은 주로 node.js의 import와 내보내기 사용법에 대한 자세한 설명을 소개하고 있는데, 편집자는 꽤 좋다고 생각합니다. 모두가 참고할 수 있도록 만들어 보세요. 편집자를 따라 살펴보겠습니다. 모두에게 도움이 되기를 바랍니다.

내보내기 노출

내보내기를 사용하여 아래와 같이 메서드, 개체, 문자열 등을 노출합니다.

//写法1
export var foo=function(){
  console.log(1);
}
//写法2
var bar ={a:"1",b:2};
export {bar};
//写法3
var baz=&#39;hello world&#39;;
export {baz as qux};

로그인 후 복사

그런 다음 babel로 컴파일한 후 위 코드는 다음과 같이 실행 가능한 node.js 코드가 됩니다. follow

"use strict";
//标记这个模块是es的模块
Object.defineProperty(exports, "__esModule", {
  value: true
});
//写法1
var foo = exports.foo = function foo() {
  console.log(1);
};
//写法2
var bar = { a: "1", b: 2 };
exports.bar = bar;
//写法3

var baz = &#39;hello world&#39;;
exports.qux = baz;

로그인 후 복사

위의 코드를 보면 es6의 내보내기가 node.js의 내보내기 노출 방식으로 변환된다는 것을 알 수 있습니다.

import import

import 작성 방법을 살펴보겠습니다. 위에서export를 작성하는 xx.js 파일을 소개합니다

첫 번째 작성 방법

import {foo,qux} from &#39;./xx&#39;;
console.log(qux);

로그인 후 복사

foo, qux가 xx에 노출됩니다. .js xx.js에 노출된 속성에는 foo, bar, qux가 포함되어 있음을 알 수 있습니다. 이 작성 방법에는 가져온 파일에 노출된 속성의 이름을 알아야 하며, 이를 모두 열거하지 않고도 필요에 따라 작성할 수 있음을 알 수 있습니다. 재산.

바벨 컴파일 코드를 살펴보겠습니다.

&#39;use strict&#39;;
var _ = require(&#39;./xx&#39;);
console.log(_.qux);

로그인 후 복사

는 xx.js를 도입하는 간단한 require 메소드이므로 이 방법으로 es6 모듈 또는 node.js Modular를 도입할 수 있습니다.

두 번째 작성 방법

import * as xx from &#39;./xx&#39;;
console.log(xx.bar);

로그인 후 복사

여기서도 xx.js를 소개합니다. 이 작성 방법은 xx.js에 노출된 모든 속성을 변수 xx에 할당합니다(실제로 module.exports에 별칭 제공). , babel로 컴파일한 후에는 다음과 같습니다.

&#39;use strict&#39;;
var _ = require(&#39;./xx&#39;);
var xx = _interopRequireWildcard(_);
function _interopRequireWildcard(obj) {
  //判断是node模块还是es模块
  if (obj && obj.__esModule) {
    return obj;
  }
  else {
    var newObj = {};
    if (obj != null) {
      for (var key in obj) { 
        if (Object.prototype.hasOwnProperty.call(obj, key)) 
         newObj[key] = obj[key];
      }
    }
  //兼容旧的babel编译
    newObj.default = obj;
    console.log(newObj);
    return newObj;
  }
}
console.log(xx.bar);

로그인 후 복사

위 코드를 보면 node 모듈인지 es 모듈인지 판별할 수 있는 방법이 있습니다. 이 작성 방법은 es 모듈과도 호환되며, 노드 모듈.

제3의 글쓰기 방식

import oo from &#39;./xx&#39;
console.log(oo.bar);

로그인 후 복사

이런 글쓰기 방식에서 oo는 언뜻 보면 두 번째 글쓰기 방식과 똑같아 보일 수도 있습니다. 컴파일된 코드를 살펴보겠습니다.

&#39;use strict&#39;;
var _ = require(&#39;./xx&#39;);
var _2 = _interopRequireDefault(_);
function _interopRequireDefault(obj) { 
 return obj && obj.__esModule ? obj : 
 { default: obj }; 
}
console.log(_2.default.bar);

로그인 후 복사

마지막 줄에서 oo.bar는 _2.default.bar로 컴파일됩니다. 기본값이 하나 더 있으면 당연히 여기 있는 막대를 찾을 수 없으므로 이 사용법은 다음과 같습니다. 내보내기 속성을 도입하는 데 사용되지 않지만 아래에 언급된 내보내기 기본값입니다.

내보내기 기본값은 한 번에 노출됩니다

다른 글에서 내보내기와 내보내기 기본값을 요약하겠습니다. 여기서는 내보내기 기본값의 사용법에 대해서만 설명하겠습니다. ㅋㅋㅋ . 속성이므로 이 두 가지 사용법이 적절하게 사용됩니다. 속성 값이 imports.default에 할당되므로 다음과 같은 사용법을 가질 수 있습니다

var foo=123;
export default foo;

로그인 후 복사

"use strict";
Object.defineProperty(exports, "__esModule", {
 value: true
});
var foo = 123;
exports.default = foo;

로그인 후 복사

export default 123;

로그인 후 복사

export default {foo:123};

로그인 후 복사

위 코드는 You만 있으므로 별도로 작성됩니다. module.exports를 사용하는 것과 같은 이유로 내보내기 기본값을 한 번 사용할 수 있습니다. 두 개 이상 쓸 수 없는 것 외에도 다음과 같은 잘못된 쓰기 방법도 있습니다.

export default function f(){}

로그인 후 복사

export 기본값도 사용할 수 있습니다. 클래스를 노출하기 위해 여기서는 자세히 설명하지 않겠습니다. 모두 노출되어 있습니다.

다른 사용법

상속

이를 모듈 상속이라고 부르는데, 이는 실제로 하위 모듈을 도입한 상위 모듈이며 하위 모듈의 노출된 속성을 노출합니다.

export default function (){}

로그인 후 복사

export default var foo=123; //错误

로그인 후 복사

다음 문장에 주의하세요.

export * from &#39;./xx&#39;;

로그인 후 복사

default 속성이 외부에 노출되지 않습니다... 이는 우리가 소개한 xx.js 파일에서 내보내기 기본값을 사용하는 것이 유효하지 않음을 보여줍니다. 대체 작성 방법은

&#39;use strict&#39;;
Object.defineProperty(exports, "__esModule", {
 value: true
});
var _ = require(&#39;./xx&#39;);
Object.keys(_).forEach(function (key) {
 if (key === "default" || key === "__esModule") return;
 Object.defineProperty(exports, key, {
  enumerable: true,
  get: function get() {
   return _[key];
  }
 });
});

로그인 후 복사

상속의 작성 방법은 여러 모듈을 구성하는 데 자주 사용되며 아래에서 언급하는 소개 패키지와 함께 사용되는 경우가 많습니다

Induction 폴더(소개 패키지)

많은 사람들이 다음 코드 줄을 이해하지 못합니다

if (key === "default" || key === "__esModule") return;

로그인 후 복사

import가 폴더를 도입할 수 있는 이유는 무엇입니까? 모든 폴더를 사용할 수 있는 것은 아닙니다. 최소한 하나의 파일은 index.js 또는 package.json이고 다른 이름의 js입니다. 폴더에 index.js가 있으므로 이 폴더는 node.js 패키지입니다(자세한 내용은 node.js 패키지 문서 참조). Import는 babel에서 require로 컴파일됩니다. 따라서 import는 폴더를 가져올 수 있습니다. index.js를 사용하여 폴더에 있는 다른 파일의 코드를 내보낼 수 있습니다. 예: