JavaScript ES6 模块化

1、ES6中模块化规范:

每个js文件都是一个独立的文件

导入其他模块成员使用import关键字

向外共享模块成员使用export关键字

2、nodejs中使用ES6模块化规范:

nodejs默认只支持CommonJS规范,要在nodejs中使用ES6的模块化规范,需要满足两个条件:

(1)nodejs版本大于等于 v14.15.1

使用命令

node --version

(2)在package.json文件中添加[type:module]的设置

{
  "name": "demo1",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "type": "module",
  "dependencies": {
    "jquery": "^3.6.0",
    "then-fs": "^2.0.0"
  }
}

3、ES6模块化基本语法:

(1)默认导出与默认导入

导出模块代码:

let n1 = '张三'
let n2 =  18

function show(){
    console.log('hello');
}

export default 
{
    n1,
    show
}

导入模块代码:

import mod1 from './mod.js'

console.log(mod1.n1)
mod1.show()

运行结果为:

张三
hello

注意事项:

每个模块中,只能使用唯一的一次export default

默认导入时,接受的名称可以使用任意名称,但需要是合法的名称,例如不能以数字开头。

(2)按需到出与按需导入

导出模块代码:

//按需导出
export let s1 = 's1'
export let s2 = 's2'
export function say(){
    console.log('hello')
}

//默认导出
export default {
    s3:'s3'
}

导入模块代码:

import msg,{s1,s2,say} from './mod2.js'

//使用按需导入
console.log(s1)
console.log(s2)
say()

//使用默认导入
console.log(msg.s3)

运行结果:

s1
s2
hello
s3

注意事项:

每个模块中可以使用多次按需到出

按需导入的成员名称必须和按需导出的名称保持一致

按需导入时,可以使用as关键字进行重命名

按需导入可以和默认导入一起使用

(3)直接导入并执行

导出模块代码:

for(let i=0;i<3;i++){
    console.log(i)
}

导入模块代码:

import './mod3.js'

运行结果

0
1
2
原文地址:https://www.cnblogs.com/asenyang/p/15678376.html