"require(x)"와 "import x"의 차이

"require(x)"와 "import x"의 차이

저는 막 MongoDB와 인터페이스하는 작은 노드 프로젝트를 시작했습니다.그러나 "Import"를 통해 해당 수 것.npm.

예를 들어, 다음 코드는 "express에 기본 내보내기가 없습니다"라는 오류를 발생시킵니다.

import express from "express";

단, 이 코드는 동작합니다.

const express = require("express");

따라서 Import 메서드와 변수/요구 메서드의 기능에는 어떤 차이가 있습니까?앞으로 더 많은 문제를 일으킬 것 같기 때문에 프로젝트 수입에 방해가 되는 것은 무엇이든 고치고 싶습니다.

이 심플한 이미지는, 다음의 2개의 차이점을 이해하는 데 도움이 됩니다.require ★★★★★★★★★★★★★★★★★」import.

그것 말고도

필요한 부품만 선택적으로 로드할 수 없습니다.require, 하하와 함께import필요한 부분만 선택적으로 로드할 수 있으므로 메모리를 절약할 수 있습니다.

로딩은 다음 기간 동안 동기화됩니다(단계별로).requireimport(이전의 Import를 기다리지 않고) 비동기화할 수 있기 때문에, 보다 조금 더 뛰어난 퍼포먼스를 얻을 수 있습니다. require.

의 주요 require ★★★★★★★★★★★★★★★★★」import 그것은 「 「 」입니까?require으로 스캔됩니다.node_modules , 「」를 참조해 주세요.importES6를 사용하세요.

대부분의 사람들은 babel을 사용하여 컴파일을 합니다.import ★★★★★★★★★★★★★★★★★」export①이 됩니다.import require.

Node은 Node.js를 지원할 수 .importNode.js의 메모로 판단하건대 (실제로 실험 버전은 이미 실행 중)import하지 않다node_modulesES6는 ES6에 대응하고 있습니다.

때문에 저는 것이 .import아직만, 이 은 지원되고 가능성이 있습니다.node_modules가알 ??

---

의 바벨, 바벨 ES6를 .import에서 Common(공통으로JS jsrequire구문을 사용합니다.

을 말합니다.app_es6.js수입하다

import format from 'date-fns/format';

이것은 노드 패키지 date-fns에서 포맷 함수를 Import하는 지시입니다.

된 " " "package.json파일에는 다음과 같은 것이 포함될 수 있습니다.

"scripts": {
    "start": "node app.js",
    "build-server-file": "babel app_es6.js --out-file app.js",
    "webpack": "webpack"
}

된 " " ".babelrc을 사용하다

{
    "presets": [
        [
            "env",
            {
                "targets":
                {
                    "node": "current"
                }
            }
        ]
    ]
}

★★★★★★★★★★★★★★★★★.build-server-file에서 package.json 파일 babel을 입니다.app_es6.js 및 " " "app.js

" " " "build-server-file를 '''를 엽니다.app.js '찾아보세요'를 .date-fns된 것을 볼 수 있습니다. import import하다

var _format = require("date-fns/format");

var _format2 = _interopRequireDefault(_format);

그 파일의 대부분은 대부분의 인간들에게 골칫거리지만, 컴퓨터는 그것을 이해한다.

---

모듈을 로서 Import를 한 date-fns 을 열어보세요.node_modules/date-fns/get_year/index.js을 사용하다

var parse = require('../parse/index.js')

function getYear (dirtyDate) {
  var date = parse(dirtyDate)
  var year = date.getFullYear()
  return year
}

module.exports = getYear

의 babel은app_es6.js츠키다

import getYear from 'date-fns/get_year';

// Which year is 2 July 2014?
var result = getYear(new Date(2014, 6, 2))
//=> 2014

그리고 babel은 수입품을 다음과 같이 변환한다.

var _get_year = require("date-fns/get_year");

var _get_year2 = _interopRequireDefault(_get_year);

그리고 함수에 대한 모든 참조를 적절하게 처리합니다.

express module with require & import의 예를 제시하겠습니다.

-스위치

var express = require('express');

- Import(가져오기)

import * as  express from 'express';

따라서 위의 문장 중 하나를 사용한 후에는 'express'라는 변수를 사용할 수 있습니다.이제 'app' 변수를 다음과 같이 정의할 수 있습니다.

var app = express(); 

그래서 'require'와 'Common'을 함께 사용합니다.JS'와 'import'를 ES6로 설정합니다.

'require' 및 'import'에 대한 자세한 내용은 아래 링크를 참조하십시오.

require - Node.js 모듈 필요: 알아야 할 모든 것

import - Node.js의 ES6 모듈 업데이트

간단하게 말씀드리지만

• Import 및 Export는 ES6 기능(차세대 JS)입니다.
• Require는 다른 파일에서 코드를 가져오는 구식 방법입니다.

JS 파일 전체가 호출되거나 포함된다는 점에서 큰 차이가 있습니다.비록 네가 그 일부가 필요하지 않더라도.

var myObject = require('./otherFile.js'); //This JS file will be included fully.

반면 Import에서는 필요한 객체/함수/변수만 추출할 수 있습니다.

import { getDate }from './utils.js'; 
//Here I am only pulling getDate method from the file instead of importing full file

하나의 큰 은 '먹다'는 '먹다'는 '먹다'로 쓸 수 입니다.require의 장소(「 」「 」「 」「 」「 」「 」로 되어 있는 장소.import 맨 .

편집: 최신 노드 버전에서는 파괴 기능을 사용할 수 있습니다.이렇게 될 것이다.

const { getDate } = require('./date.js');

새로운 ES6:

'import'는 js 파일 간에 변수/변수/변수/변수를 공유하기 위해 'export' 키워드는 다음과 같습니다.

export default myObject;

//....in another file

import myObject from './otherFile.js';

old skool:

'filename'은 'filename.filename'과 함께 사용해야 합니다.

 module.exports = myObject;

//....in another file

var myObject = require('./otherFile.js');

여기에는 큰 차이가 있습니다.

import express from "express";

또, 이하와 같이 됩니다.

import * as express from "express";

Common의 올바른 번역JS에서 ES6로

const express = require("express");

두 번째 Import입니다.

첫 module을 입니다.express '''express. "Import"라는 두express.

import래래 from 에서 오다ES6입니다.CommonJs(여기서 「」)require서서왔왔왔왔다다마지막으로 구문의 차이에 대해 설명하겠습니다만, 현시점에서는, 왜 이것을 갱신했는지에 대해 설명합니다.

require시 즉, 중간에 동작합니다.즉, 의 위 부분이 에만 실행됩니다 스크립트 중간에 정의하면 다른 JavaScript 함수와 같이 동작합니다.즉, 스크립트의 위 부분은 이를 인식하지 않거나 if 문 안에 넣으면 if 표현이 true인 경우에만 실행됩니다.또는 다른 함수에 넣으면 함수가 실행될 때만 실행됩니다.

반,는import는 스태틱레벨로 실행되며, 반드시 루트레벨에 있어야 하며 조건문 또는 함수 내에 있어서는 안 된다는 규칙이 있습니다.Import( Import) JavaScript(JavaScript)를 선택합니다.

의 수입 을 "일본의 수입 방법"으로 입니다.ES6.

그렇다면 ES6가 더 나은 경우 노드가 CommonJs 모듈을 계속 사용하는 이유는 무엇입니까?

노드에는 CommonJs 모듈을 사용하는 대규모 코드베이스가 있으며, ES6로의 변환은 수년간 지원되기 때문에 매우 어렵습니다.그러나 노드에는 ES6 코드를 쓸 수 있는 툴이 많이 있습니다만, 최종적으로 이 툴에 의해 CommonJs로 변환됩니다.

구문의 차이:

Import는 패키지에서 내보내는 방법에 따라 달라집니다.

like함또또또 like like like like like like like like like like like like like like like like like like like like like like like like like like.module.export = functionNameCommondJs ★★★★★★★★★★★★★★★★★」export default functionNameES6수입품은 이렇게 될 것이다.

CommonJs에서의 Import와 ES6에서의 Import

const functionName = require("package/exampleFile"); // CommonJs

import functionName from "package/expampleFile.js"; // ES6.
// here you can see that we need to add .js at the end of the file

.module.exports = {functionName1, functionName2}CommonJs ★★★★★★★★★★★★★★★★★」export functionName1 export functionName2ES6그러면 수입은 이렇게 됩니다.

const {functionName1, functionName2} = require("package/exampleFile"); // CommonJs

import {functionName1, functionName2} from "package/expampleFile.js"; // ES6.

이 도구들은 다른 세대에 속합니다.

require는 CommonJS내의 및 위해 된 Node) 및 "CommonJS"(" Import")에만 합니다.import는 ES6, JavaScript(Node를 사용할수 있는 도구입니다.ES6는 JavaScript(Node.js)는 JavaScript(Node.js)입니다.

용법에 .import합니다.require.

단, 일부 브라우저는 여전히 ES6를 지원하지 않으므로 사용하기 전에 컴파일이 필요할 수 있습니다.

requiremodule.exports이것은 모듈을 내보내기 위한 "오래된" 구문(아직 유효한)입니다.이 구문에는 오브젝트, 문자열 등 원하는 것이 모두 사용할 수 있습니다.

import다 할 수 . 즉, 이 두 가지를 모두 사용할 수 .module.exports ★★★★★★★★★★★★★★★★★」export, 하다, 하다, , , 하다와 수 있습니다.module.export 하다의 중 죠. 의 장점 중 하나입니다.import수입하다

예:

내보낼 파일:

// A.js file

// CommonJS syntax
module.exports = {
     foo: function(){ return 'bar';},
     baz: 123
}

// ES6 syntax
export function foo(){ return 'bar';}
export const baz = 123;

// or

function foo(){ return 'bar';}
const baz = 123;

export default {foo, baz};

가져오는 파일:

// B.js file

// CommonJS syntax
const A = require('./A.js');
const foo = A.foo;
const baz = A.baz;

// ES6 syntax
import * as A from './A.js';
const foo = A.foo;
const baz = A.baz;

// or only
import {foo, baz} from './A.js';

「 」를 사용하는 export default(ES6 구문) 이것은 파일당1개만 내보내는 것을 의미합니다.일 ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★import조각만 가져올 수 있습니다. 예를 ㄴㄴ, ㄴ, ㄴ다, ㄴ다, 쓰면 돼요.import foo from './A.js';{} ★★★★★★★★★★★★★★★★★」* as foo.

출처 : https://pt.stackoverflow.com/a/213938/317251

언급URL : https://stackoverflow.com/questions/46677752/the-difference-between-requirex-and-import-x