export导出语法

// default exports
export default 42;
export default {};
export default [];
export default foo;
export default function () {}
export default class {}
export default function foo () {}
export default class foo {} // variables exports
export var foo = 1;
export var foo = function () {};
export var bar; // lazy initialization
export let foo = 2;
export let bar; // lazy initialization
export const foo = 3;
export function foo () {}
export class foo {} // named exports
export {foo};
export {foo, bar};
export {foo as bar};
export {foo as default};
export {foo as default, bar}; // exports from
export * from "foo";
export {foo} from "foo";
export {foo, bar} from "foo";
export {foo as bar} from "foo";
export {foo as default} from "foo";
export {foo as default, bar} from "foo";
export {default} from "foo";
export {default as foo} from "foo"; 示例: 1、export {function};
  导出一个函数
2、export const foo = 2;
  导出一个常量
3、export default myFunctionClass;
  默认导出,每个模块只有一个默认导出,导出的可以是一个函数,一个对象,一个类 import导入语法 // default imports
import foo from "foo";
import {default as foo} from "foo"; // named imports
import {bar} from "foo";
import {bar, baz} from "foo";
import {bar as baz} from "foo";
import {bar as baz, xyz} from "foo"; // glob imports
import * as foo from "foo"; // mixing imports
import foo, {baz as xyz} from "foo";
import * as bar, {baz as xyz} from "foo";
import foo, * as bar, {baz as xyz} from "foo"; 示例 1、import name from 'my-module.js' ;
  导出整个模块到当前作用域,name作为接收该模块的对象名称
  
2、import {moduleName} from 'my-module.js';
导出模块中的单个成员moduleName 3、import {moduleName1,moduleName2} from 'my-module';
  导出模块中的多个成员moduleName1、moduleName2
  
4、import {moduleName as moduleAlias} from 'my-module'; 5、import myDefault,{moduleName1,moduleName2} from 'my-module';
  myDefault为my-module.js文件default导出项 注意事项 导入语句只能作为模块顶层的语句出现,不能出现在 function 里面或是 if 里面
if(Math.random()>0.5){
import './module1.js'; // SyntaxError: Unexpected keyword 'import'
}
const import2 = (import './main2.js'); // SyntaxError
try{
import './module3.js'; // SyntaxError: Unexpected keyword 'import'
}catch(err){
console.error(err);
}
const moduleNumber = 4; import module4 from `module${moduleNumber}`; // SyntaxError: Unexpected token import 语句会被提升到文件顶部执行,也就是说在模块初始化的时候所有的 import 都必须已经导入完成
import './module1.js';
alert('code1'); import module2 from './module2.js';
alert('code2'); import module3 from './module3.js'; // 执行结果
module1
module2
module3 import 的模块名只能是字符串常量,导入的值也是不可变对象;比如说你不能 import { a } from ‘./a’ 然后给 a 赋值个其他什么东西

[转] ES6 import/export:模块导入导出方式的更多相关文章

  1. es6 中的模块导入与nodejs 中模块的导入的异同!

    我们知道es6 的模块导入导出是通过import 和 export 来实现,而nodejs的模块导入导出是通过require 和module.exports 来实现,那么它们有什么异同吗? 请看如下: ...

  2. Node.js模块导入导出

    这篇文章本来是想模块导入导出和事件循环一起写的,但是感觉一起写的话会太长了,所以就分开两篇文章写吧.下一篇会重点介绍一下js中的事件循环,js代码到底是以何种顺序去执行的呢?我相信你看懂了事件循环再去 ...

  3. es6 import export 引入导出变量方式

    var testdata='sdfkshdf'; //export testdata;//err export {testdata as ms}; export var firstName = 'Mi ...

  4. [vue]js模块导入导出export default

    webstrom调试未授权问题解决 分es6语法和node语法 参考 参考 - export default s1 1.仅能出现1次default 2.导入时候可以随便命名 3,导出时候不必写{} - ...

  5. javascript模块导入导出

    第一次知道javascript有模块的概念通常都是使用<script>标签进行引入,不过只能在html文件上使用 增加的模块就如同php里的include.require可以使用引入的内容 ...

  6. js模块导入/导出大全

    说明 module.exports与exports是CommonJS的规范 export与export default是es6规范 require 是 AMD规范引入方式 import是es6的一个语 ...

  7. hive数据的导入导出方式

    导入方式 1.load方式 load data local inpath 'local_path' into table tb_name; 从本地复制了文件到表的路径下 应用场景:大部分的使用,文件几 ...

  8. es6 import export 与 node 中的module.exports exports

    1.export a.export 变量 export var name = 'jack';export var age = 18;//等同于 var name = 'jack';var age = ...

  9. 关于es6 import export的学习随笔

    记得之前的一次面试中,有个面试官问了我关于es6导入和导出的一些知识点,可惜当时对这方面没在意,只知道每次机械的import和export,也不知道为啥要这样用,现在静下心来,好好的把这块看了下,顺便 ...

随机推荐

  1. IdeaVim-常用操作

    IdeaVim简介 IdeaVim是IntelliJ IDEA的一款插件,他提高了我们写代码的速度,对代码的跳转,查找也很友好. 安装位置 安装之后它在 Tools > Vim Emulator ...

  2. HDU - 3006 The Number of set(状态压缩位运算)

    http://acm.hdu.edu.cn/showproblem.php?pid=3006 题意 给定n个集合,每个集合都是由大于等于1小于等于m的数字组成,m最大为14.问由给出的集合可以组成多少 ...

  3. Ant基础知识2

    Ant: 1.在windows上搭建Ant环境,成功后查看版本号 答案: (1)安装jdk,配置环境变量 (2)安装ant,配置环境变量,添加ANT_HOME,在path中加入%ANT_HOME%\b ...

  4. [C++]Linux之Ubuntu下编译C程序出现错误:“ stray ‘\302'或者'\240' in program”的解决方案

    参考文献:[error: stray ‘\240’ in program或 error: stray ‘\302’ in program](http://blog.csdn.net/u01299585 ...

  5. Kafka0.10.0安装配置

    1 解压文件 tar -zvxf kafka_2.11-0.10.0.0.tgz 2 修改配置server.properties vim server.properties broker.id=1 z ...

  6. Flask最强攻略 - 跟DragonFire学Flask - 第八篇 实例化Flask的参数 及 对app的配置

    Flask 是一个非常灵活且短小精干的web框架 , 那么灵活性从什么地方体现呢? 有一个神奇的东西叫 Flask配置 , 这个东西怎么用呢? 它能给我们带来怎么样的方便呢? 首先展示一下: from ...

  7. tidb 架构~tidb 理论学习(1)

    一 简介:介绍新型NEW SQL数据库tidb 二 目的: tidb出现的目的,就是代替mysql+中间件,实现横向水平扩展 三 核心理论观点 1 MySQL 是单机数据库,只能通过 XA 来满足跨数 ...

  8. 第一次安卓android studio安装,常见问题。

    出处:纸月 托了很久终于开始学习安卓了,之前看课本教程<第一行代码>用的是eclipse,但后来它不支持了就决定用android studio,第一次安装就出现了一些小的问题 第一个是关于 ...

  9. 编写灵活、稳定、高质量的 css代码的规范

    语法 用两个空格来代替制表符(tab) -- 这是唯一能保证在所有环境下获得一致展现的方法. 为选择器分组时,将单独的选择器单独放在一行. 为了代码的易读性,在每个声明块的左花括号前添加一个空格. 声 ...

  10. 批量下载Coursera及其他场景上的文件

    以下方法同样适用于其他场景的批量下载. 最近在学习Coursera退出的深度学习课程,我希望把课程提供的作业下载下来以备以后复习,但是课程有很多文件,比如说脸部识别一课中的参数就多达226个csv文件 ...