Home  >  Article  >  Web Front-end  >  What method is used to export modules in es6

What method is used to export modules in es6

WBOY
WBOYOriginal
2022-05-06 15:54:342850browse

The method used to export modules in es6: 1. Export the default module. A module file can only have one default module. The syntax is "export default members that need to be exported"; 2. Export ordinary modules, one module file. There can be multiple ordinary modules, and the syntax is "export members exported on demand".

What method is used to export modules in es6

The operating environment of this tutorial: Windows 10 system, ECMAScript version 6.0, Dell G3 computer.

What method is used to export modules in es6

Default export

A module file can only have one default module, and there can be multiple Ordinary module

Statement: export default members that need to be exported

const n1 = 10
const n2 = 20
 
const show = () => {
  console.log('hello')
}
 
export default {
  n1,
  show
}

Default import

Statement: import variable name from 'module identification Symbol '

import m1 from './1.默认导出.js'
console.log(m1)

Note:

In each module, only one export default is allowed, otherwise an error will be reported!

The default receiving name during import can be any name, as long as it is a legal member name

Export on demand

You can put any data Types are exported as modules

Syntax: Syntax for export on demand: export members exported on demand

export const n1 = 10
 
export const n2 = 20

Imported on demand

Imported on demand Syntax: import { m1 } from 'module identifier'

import { n1 } from './3.按需导出.js'
 
console.log(n1)

Notes on on-demand import and on-demand export:

  • Can be used multiple times in each module Export on demand

  • The member name imported on demand must be consistent with the name exported on demand

  • When importing on demand, you can use as Rename keywords

  • On-demand import can be used together with the default import

[Related recommendations: javascript video tutorialwebfrontend

The above is the detailed content of What method is used to export modules in es6. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article:What is let in es6Next article:What is let in es6