模块功能主要由两个命令构成:exportimport。

export用于输出对外接口,improt用于输人接口

exprot 可以输出变量,也可以输出函数、类。

输出变量的三种写法

// 写法一
export var m = 1;

// 写法二,运用结构赋值
var m = 1;
export {m};

// 写法三
var n = 1;
export {n as m};

输出函数

//在test.js里面输出

export function add(x) {

  return x + 1;

}

也可以写成

function add(x) {

  return x + 1;

}

export {add};

获取函数

//在main.js里面获取

import add from './test.js'  //'./test.js'是文件路径

add(1)  //2

输出类

写法1

export class Point {

  constructor(x, y) {

    return this.x;

    return this.y;

  }

}

//写法2,跟1差不多

class Point1 {

  constructor(x, y) {

    return this.x;

    return this.y;

  }

}

export {Point,Poiont1}

获取

import {Point,Point1} from './test.js';

var a = new Point(1,2);

前面的例子使用import需要知道变量名与函数名

使用export default 命令获取则不需要

export default function foo() {

  console.log('foo');

}

或者写成

function foo() {

  console.log('foo');

}

export default foo

//test.js

function foo() {

  console.log('foo');

}

export {foo as default}

//main.js

import {default as xxx} from './test.js'

 

es6模块学习总结的更多相关文章

  1. ES6模块的import和export用法总结

    ES6之前以前出现了js模块加载的方案,最主要的是CommonJS和AMD规范.commonjs前者主要应用于服务器,实现同步加载,如nodejs.AMD规范应用于浏览器,如requirejs,为异步 ...

  2. Webpack4教程:第一部分,入口、输入和ES6模块

    转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具.解决方案和服务,赋能开发者. 原文出处:https://wanago.io/2018/07/16/webpack-4-course-par ...

  3. ES6模块的import和export用法

    ES6之前已经出现了js模块加载的方案,最主要的是CommonJS和AMD规范.commonjs主要应用于服务器,实现同步加载,如nodejs.AMD规范应用于浏览器,如requirejs,为异步加载 ...

  4. ES6模块import细节

    写在前面,目前浏览器对ES6的import支持还不是很好,需要用bable转译. ES6引入外部模块分两种情况: 1.导入外部的变量或函数等: import {firstName, lastName, ...

  5. Day5 - Python基础5 常用模块学习

    Python 之路 Day5 - 常用模块学习   本节大纲: 模块介绍 time &datetime模块 random os sys shutil json & picle shel ...

  6. # nodejs模块学习: express 解析

    # nodejs模块学习: express 解析 nodejs 发展很快,从 npm 上面的包托管数量就可以看出来.不过从另一方面来看,也是反映了 nodejs 的基础不稳固,需要开发者创造大量的轮子 ...

  7. commonjs模块和es6模块的区别

    commonjs模块与es6模块的区别 到目前为止,已经实习了3个月的时间了.最近在面试,在面试题里面有题目涉及到模块循环加载的知识.趁着这个机会,将commonjs模块与es6模块之间一些重要的的区 ...

  8. ES6模块之export和import详解

    ES6中的模块即使一个包含JS代码的文件,在这个模块中所有的变量都是对其他模块不可见的,除非我们导出它.ES6的模块系统大致分为导出(export)和导入(import)两个模块. 1.模块导出(ex ...

  9. ES6 模块机制

    ES6 实现了模块功能 将文件当作独立的模块,一个文件一个模块 每个模块可以导出自己的API成员,也可以导入其他模块或者模块中特定的API ES6 模块的设计思想,是尽量的静态化,使得编译时就能确定模 ...

随机推荐

  1. mpvue-小程序之蹲坑记

    1. 不支持 v-html 小程序里所有的 BOM/DOM 都不能用,也就是说 v-html 指令不能用 部分复杂的 JavaScript 渲染表达式 {{}} 双花括号的部分,直接编码到 wxml ...

  2. Max-heap && Min-heap && push_heap

    最大堆:make_heap(vi.begin(),vi.end()) #include <iostream> #include <vector> #include <al ...

  3. Bootstrap模态框垂直居中展示的方法

    在bootstrap.js中加入以下代码:

  4. [python] 如何将unicode字符串转换为中文

    答案:(http://stackoverflow.com/) ps:这个网站解决了我好多问题啊,大家多上 >>>s='\u9648\u4f1f\u9706\u5176\u5b9e\u ...

  5. UVALive 3882.And Then There Was One-约瑟夫问题(递推)

    And Then There Was One Time limit: 3.000 seconds Let’s play a stone removing game. Initially, n ston ...

  6. 康托展开&逆展开算法笔记

    康托展开(有关全排列) 康托展开:已知一个排列,求这个排列在全排列中是第几个 康托展开逆运算:已知在全排列中排第几,求这个排列 定义: X=an(n-1)!+an-1(n-2)!+...+ai(i-1 ...

  7. D - Interesting Calculator 【数值型BFS+优先队列】

    There is an interesting calculator. It has 3 rows of buttons. Row 1: button 0, 1, 2, 3, ..., 9. Pres ...

  8. HDU 2280 Tetris Comes Back

    状态压缩,$dp$,预处理. 设$dp[i][j]$为前$i-1$行填满,第$i$行为状态$j$的最小需要$1$种类的数量.预处理好每种状态能推出哪些状态,并且记录下所需花费就可以了. #pragma ...

  9. Lightoj-1356 Prime Independence(质因子分解)(Hopcroft-Karp优化的最大匹配)

    题意: 找出一个集合中的最大独立集,任意两数字之间不能是素数倍数的关系. 思路: 最大独立集,必然是二分图. 最大数字50w,考虑对每个数质因子分解,然后枚举所有除去一个质因子后的数是否存在,存在则建 ...

  10. AOJ 2251 Merry Christmas (最小点覆盖)

    [题目链接] http://judge.u-aizu.ac.jp/onlinejudge/description.jsp?id=2251 [题目大意] 给出一张图,现在有一些任务,要求在ti时刻送礼物 ...