>웹 프론트엔드 >JS 튜토리얼 >node.js에서 가져오기 및 내보내기를 사용하는 방법

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

小云云
小云云원래의
2018-01-30 09:47:221829검색

가져오기 및 내보내기는 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='hello world';
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 = 'hello world';
exports.qux = baz;

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

import import

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

첫 번째 작성 방법


import {foo,qux} from './xx';
console.log(qux);

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

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


'use strict';
var _ = require('./xx');
console.log(_.qux);

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

두 번째 작성 방법


import * as xx from './xx';
console.log(xx.bar);

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


'use strict';
var _ = require('./xx');
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 './xx'
console.log(oo.bar);

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


'use strict';
var _ = require('./xx');
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 './xx';

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


'use strict';
Object.defineProperty(exports, "__esModule", {
 value: true
});
var _ = require('./xx');
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를 사용하여 폴더에 있는 다른 파일의 코드를 내보낼 수 있습니다. 예:


export {default} from './xx';

oo 폴더를 가져와서 1.js 및 2.js에 노출된 속성.

요약

babel로 컴파일된 코드를 보면, 내보내기와 내보내기, module.exports와 내보내기 기본값의 사용법이 유사하다는 것을 알 수 있습니다. 무엇을 사용하고 어떻게 사용하는지는 개인 취향에 따라 다릅니다.

관련 권장사항:

JavaScript ES6

에서 내보내기 가져오기와 내보내기 기본값의 사용법과 차이점에 대한 자세한 설명

위 내용은 node.js에서 가져오기 및 내보내기를 사용하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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