模块的export和import

2019-06-14  本文已影响0人  meteornnnight

模块export和import的基本语法:

1. export

export有2种写法:
可以这样写:

export var firstname="jack";
export function printName(firstname, lastname){
    console.log(firstname+lastname);
}

也可以这样写, 把export放在最后,这样一眼就能够看出export哪些变量

var firstname="jack";
function printName(firstname, lastname){
    console.log(firstname+lastname);
}
export {firstname, printName};

2. import

import的写法和export对应,就是通过export暴露的变量名接口,引入就可以。

import {firstname, printName} from './profile.js' //字符串里面放js文件的目录

一般不建议改动import的变量;import还带有变量提升,因为是在编译阶段就执行了import命令,所以存在变量提升。

export default

import的时候需要知道接口名称,这样非常不方便。export default可以解决这个问题,下面是正常export和export default的比较:

// 第一组
export default function crc32() { // 输出
  // ...
}

import crc32 from 'crc32'; // 输入, crc32这个变量名可以任意命名

// 第二组
export function crc32() { // 输出
  // ...
};

import {crc32} from 'crc32'; // 输入

可以看到:1. 引入export default导出的接口不需要加{}大括号;2. export default可以导出非匿名函数,函数名在引入模块的文件内其实是无效的。因为export default命令的本质是将后面的值,赋给default变量,所以可以直接将一个值写在export default之后。比如:

export default 1;
export default function(){};
export default {
}
上一篇下一篇

猜你喜欢

热点阅读