export default 和exprot

1.默认导入和默认导出

语法:

export default {

  需要输出的内容


}

接收:

import 成员变量的名字 from '文件夹的路径'

案例：

a.mjs文件夹下默认导出

export default{
    a:10,
    b:20,
    show(){
        console.log(123);
    }
}

在b.mjs文件中用成员变量进行接收

import  AA  from "./a.mjs";
console.log(AA.a);

打印的结果:

访问方法:

import  AA  from "./a.mjs";
console.log(AA.show());

从打印的结果来看,访问方法任然可以访问。

2.按需导入和按需导出

语法

export  变量
export  方法

接收

import { a, b, say } from "a.mjs";

注意点:? 一定要有{},且成员变量的名字要和导出的名字保持一致,如需更改可以as来进行更改。

案例

export let a=10
export let b=20
export function say(){
    console.log('吃饭,睡觉,打豆豆');
}

import { a, b, say } from "a.mjs";
console.log(a);
console.log(b);
console.log(say());

如果名字保持不一直

将导出的成员变量的名字a改成成员变量c

import { c, b, say } from "./a.mjs";
console.log(c);
console.log(b);
console.log(say());

as改名字

语法:

import {    成员变量的名字 as 要更改的名字  , b, say } from "./a.mjs";

代码:

import {  a as c  , b, say } from "./a.mjs";

在输出：

可以访问:

3.直接导入使用

语法:

import  "文件的路径";

案例：

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

import  "./a.mjs";

运行的结果:

可以看出使用直接导入的方法,立马就能在控制台里面输出a.mjs的结果,相比于上面的按需导入和默认导入，直接导入不用使用任何成员的变量来进行接收。

4.总结

1.export default 默认导出,成员变量可以是任意的名字(符合命名的规则)。

2.export 按需导出,成员变量的名字必须要和导出的名字保持一直，如果要改名字需要用as

语法:

导出的成员变量的名字 as 要改的名字