美文网首页
ES6-模块

ES6-模块

作者: zhenghongmo | 来源:发表于2020-03-13 16:37 被阅读0次

title:
date: 2019-01-11 11:35:56
tags:


import

  • import语句用于导入由另一个模块导出的绑定。
  • 在浏览器中, import语句只能在声明了type="module"的script的标签中使用。

导入整个模块的内容

import * as name from './1.js'

  • 导入1.js中导出的所有模块,并且命名为name
  • 可以用name调用导入的变量及函数,例如导入的模块包含一个doAllTheAmazingThings(),则可以用name.doAllTheAmazingThings()来调用。

导入单个导出

import {myExport} from './1.js'

导入多个导出

import {foo, bar} from './1.js'

重命名导出

import { reallyReallyLongModuleMemberName as shortName, anotherLongModuleName as short } from './1.js'

导入默认值

import myDefault from './1.js'

  • mydefault不一定要与export default中的命名一样,可以随意命名。

仅为副作用而导入一个模块

import './1.js'

  • 运行1.js模块中的全局代码, 但实际上不导入任何值。函数由于没有被调用所以不会执行。

export

//1.js
function cube(x) {
  return x * x * x;
}

const foo = Math.PI + Math.SQRT2;

export { cube,foo };

//main.js

import { cube, foo } from './1.js';
console.log(cube(3)); // 27
console.log(foo);    // 4.555806215962888

export default

//1.js
export default function cube(x) {
  return x * x * x;
}

//main.js
import fn from './1.js'
fn(3) //27
  • 不能使用var,let或const用于导出默认值export default。

相关文章

网友评论

      本文标题:ES6-模块

      本文链接:https://www.haomeiwen.com/subject/panujhtx.html