ES6 模块不是对象,而是通过export命令显式指定输出的代码,再通过import命令输入。

下面列出几种importexport的基本语法:

第一种方式:

  在lib.js文件中, 使用 export{接口} 导出接口, 大括号中的接口名字为上面定义的变量, importexport是对应的;

//lib.js 文件
let bar = "stringBar";
let foo = "stringFoo";
let fn0 = function() {
console.log("fn0");
};
let fn1 = function() {
console.log("fn1");
};
export{ bar , foo, fn0, fn1} //main.js文件
import {bar,foo, fn0, fn1} from "./lib";
console.log(bar+"_"+foo);
fn0();
fn1();

 第二总方法:

 在export接口的时候, 我们可以使用 XX as YY, 把导出的接口名字改了, 比如: closureFn as sayingFn

//lib.js文件
let fn0 = function() {
console.log("fn0");
};
let obj0 = {}
export { fn0 as foo, obj0 as bar}; //main.js文件
import {foo, bar} from "./lib";
foo();
console.log(bar);

第三种导出的方式:

这种方式是直接在export的地方定义导出的函数,或者变量:

//lib.js文件
export let foo = ()=> {console.log("fnFoo") ;return "foo"},bar = "stringBar"; //main.js文件
import {foo, bar} from "./lib";
console.log(foo());
console.log(bar);

  

es6 ----- export 和 import的更多相关文章

  1. ES6 export,import报错

    问题描述: 现有两个文件: profile.js const firstName = 'Michael'; const lastName = 'Jackson'; const year = 2018; ...

  2. es6 export、import

    一.输出变量 1.export var a = 0; 2.var a = 0'; export {a}; 3.var a =0 ; export {a as rename}; //使用as重命名的对外 ...

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

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

  4. ES6中的export以及import的使用多样性

    模块功能主要由两个命令构成:export和import.export命令用于规定模块的对外接口,import命令用于输入其他模块提供的功能. 一.export导出模块使用部分的几种方式 一个模块就是一 ...

  5. ES6模块之export和import详解

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

  6. ES6模块的import和export用法

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

  7. ES6 模块化(Module)export和import详解 export default

    ES6 模块化(Module)export和import详解 - CSDN博客 https://blog.csdn.net/pcaxb/article/details/53670097 微信小程序笔记 ...

  8. ES6学习笔记(十九)Module 的语法-export和import

    1.概述 历史上,JavaScript 一直没有模块(module)体系,无法将一个大程序拆分成互相依赖的小文件,再用简单的方法拼装起来.其他语言都有这项功能,比如 Ruby 的require.Pyt ...

  9. JavaScript ES6中export、import与export default的用法和区别

    前言 相信很多人都使用过export.export default.import,然而它们到底有什么区别呢? 在看他们之间的区别之前,我们先来看看它们的用法. ES6 import和export的用法 ...

随机推荐

  1. zookeeper伪分布安装配置

    1.下载路径为:http://mirrors.cnnic.cn/apache/zookeeper/stable/ 2.安装: 第一步 解压zookeeper压缩包: 进入 zookeeper安装目录 ...

  2. CUDA学习笔记(五)

    终于实质分析线程的内容了:按照SIMD的方式,每32个线程称为一个线程束,这些线程都执行同一指令,且每个线程都使用私有寄存器进行这一操作请求. 忽然觉得,做CUDA的程序就像是去北京上班:写MPI之后 ...

  3. 相机拍照友盟检测crash是为什么?

    友盟报错如下* setObjectForKey: object cannot be nil (key: UIImagePickerControllerOriginalImage)(null)(( 0 ...

  4. AngularJS 导航栏动态添加.active

    在传统jQuery中,实现导航栏动态添加.active类的思路比较简单,就是当点击的时候,清除其他.active,然后给当前类加上.active. 但是在AngularJS中,就不能再采用这种jQue ...

  5. Spring MVC 核心架构图

    架构图对应的DispatcherServlet核心代码如下: //前端控制器分派方法 protected void doDispatch(HttpServletRequest request, Htt ...

  6. 细说ReactiveCocoa的冷信号与热信号(一)

    热信号:事件触发: 冷信号:订阅出发: 从本质上来说,是信号的存在和产生,是静态信号和动态信号的区别. 背景 ReactiveCocoa(简称RAC)是最初由GitHub团队开发的一套基于Cocoa的 ...

  7. AOC 电视机T3212M 进入 工厂模式方法,修改开机启动方式

    原启动方式: 通电,再按遥控 器上  “开机” 希望改成:  通电直接打开电视 方法: 1. 按遥控器上的 menu  1147  进入 工厂模式 2.  选择   7  General Settin ...

  8. Http协议与TCP协议理解(转载的)

    TCP协议对应于传输层,而HTTP协议对应于应用层,从本质上来说,二者没有可比性.Http协议是建立在TCP协议基础之上的,当浏览器需要从服务器获取网页数据的时候,会发出一次Http请求.Http会通 ...

  9. vue-router 实现无效路由(404)的友好提示

    最近在做一个基于vue-router的SPA,想对无效路由(404)页面做下统一处理.这次我真的没有在官方文档找到具体的说明[捂脸]所以本文仅是我DIY的一个思路,求轻虐=_= 在我的理解中,vue- ...

  10. stl之set集合容器应用基础

    set集合容器使用一种称为红黑树(Red-Black Tree) 的平衡二叉检索树的数据结构,来组织泛化的元素数据.每一个节点包括一个取值红色或黑色的颜色域.以利于进行树的平衡处理.作为节点键值的元素 ...