“This is the 10th day of my participation in the First Challenge 2022. For details: First Challenge 2022”

We all know that require() and import() are used to import modules, but there are big differences between them.

But book color, yan in the west; But the article has China, show in the hundred hui. – PiRiXiu

  • require()

In Node.js, require() is a built-in function used to import external modules with separate files; Require () can read a JavaScript file, execute it, and return the exported object. Require can add not only built-in core NodeJS modules, but also local modules;

var myVar = require('http'); //to use built-in modules

var myVar2 = require('./myLocaModule'); //to use local modules
Copy the code
  • import()

Import () is usually paired with export() to introduce ES modules, which are part of the ES6 specification. They are only allowed in ES modules and cannot be used to import other modules with other file types, such as.json. Can be used to import resources or package names in the form of path urls; Import statements cannot be used if the Script Script does not set type=’module’;

var myVac = import("module-name");
Copy the code
  • require() vs import()

  1. Require () can be called anywhere

Typically, we call the import() or require() statement at the beginning of the file. But in practice, you can call require() anywhere in the code, and import() statements can only be defined at the beginning of the file. Use the import() statement elsewhere, and you get an error: move to the beginning of the file.

If (x > 2) {import a from "./a"; } ///repl: 'import' and 'export' may only appear at the top level (2:2)Copy the code

The import command is statically analyzed by the JS engine (compile phase) and executed before other modules, so an error is reported.

  1. Require () can be put in a conditional judgment

The code is as follows:

//require if(user.id == 1){const getBlogTitle = require('./ blogdetails.js'); } //import if(...) { import ... ; // Error, not allowed! } { import ... ; // Error, we can't put import in any block }Copy the code
  1. The ES module can also be invoked dynamically

The ES module also supports dynamic calls, although the import notation cannot be used in conditional judgments:

It is written as import (./ XXX), not import x from ‘./ XXX ‘.

This point is very important, pay attention to distinguish!

 //dynamic import
let {hi, bye} = await import('./say.js');  
hi(); // Hello!
bye(); // Bye!

//OR

let say = await import('./say.js');     
say.hi(); // Hello!     
say.bye(); // Bye!
Copy the code

When import() successfully loads a module, the module is treated as an object as an argument to the then method. Therefore, you can use the syntax of object deconstruction assignment to get the output interface.

import("./myModule.js").then(({ export1, export2 }) => { // ... });Copy the code
  1. Import () is asynchronous;

When the module is loaded using the require command, the entire module code is run;

Import is written at the top of the file, but the loaded module is executed only when the script encounters this read-only variable (asynchronously loaded)

Import x from ‘./ XXX ‘and import(./ XXX);

I’m Nuggets Anthony, output exposure input, technical insight into life, goodbye ~