export

最正常:

    var firstName = 'Michael';
var lastName = 'Jackson';
var year = 1958;
export { firstName, lastName, year };

输出函数或类:

    export function multiply(x, y) {
return x * y;
};

重命名:

    function v1() { ... }
function v2() { ... } export {
v1 as streamV1,
v2 as streamV2,
v2 as streamLatestVersion
};

动态改变输出的值:

    export var foo = 'bar';
setTimeout(() => foo = 'baz', 500);
//上面代码输出变量foo,值为bar,500 毫秒之后变成baz。

多个输出,import

// circle.js
export function area(radius) {
return Math.PI * radius * radius;
}
export function circumference(radius) {
return 2 * Math.PI * radius;
} import * as circle from './circle'; console.log('圆面积:' + circle.area(4));
console.log('圆周长:' + circle.circumference(14));

export和export default

理解:
1.export的时候,单个变量输出,可以import变量({area}或者* as circle(circle为对象))
2.export default的时候,相当于导出的整个对象,所以不用括号,可以对象.属性(直接定义对象名circle(对象))
// 第一组
export default function crc32() { // 输出
// ...
} import crc32 from 'crc32'; // 输入 // 第二组
export function crc32() { // 输出
// ...
}; import {crc32} from 'crc32'; // 输入 第一组是使用export default时,对应的import语句不需要使用大括号;
第二组是不使用export default时,对应的import语句需要使用大括号。 export default命令用于指定模块的默认输出。显然,一个模块只能有一个默认输出,因此export default命令只能使用一次。所以,import命令后面才不用加大括号,因为只可能唯一对应export default命令。 // 正确
export var a = 1; // 正确
var a = 1;
export default a;
上面代码中,export default a的含义是将变量a的值赋给变量default。

import

导入组件中的部分对象

import { stat, exists, readFile } from 'fs';

导入整个对象

import fs from 'fs';
使用的时候
fs.stat
fs.exists
fs.readFile

导入对象重命名

import { lastName as surname } from './profile.js';

import命令输入的变量都是只读的

import命令具有提升效果,会提升到整个模块的头部,首先执行

foo();

import { foo } from 'my_module';
//不会报错

仅仅执行lodash模块,但是不输入任何值.代码加载了两次lodash,但是只会执行一次。

import 'lodash';
import 'lodash';

import,export深入理解的更多相关文章

  1. require/exports 与 import/export 的区别?

    文章作者:寸志链接:https://www.zhihu.com/question/56820346/answer/150724784来源:知乎 遵循的模块化规范不一样 模块化规范:即为 JavaScr ...

  2. 探讨ES6的import export default 和CommonJS的require module.exports

    今天来扒一扒在node和ES6中的module,主要是为了区分node和ES6中的不同意义,避免概念上的混淆,同时也分享一下,自己在这个坑里获得的心得. 在ES6之前 模块的概念是在ES6发布之前就出 ...

  3. wx import require的理解

    服务器端的Node.js遵循CommonJS规范.核心思想是允许模块通过require 方法来同步加载所要依赖的其他模块,然后通过 exports或module.exports来导出需要暴露的接口. ...

  4. ES6中的export,import ,export default

    ES6模块主要有两个功能:export和importexport用于对外输出本模块(一个文件可以理解为一个模块)变量的接口import用于在一个模块中加载另一个含有export接口的模块.也就是说使用 ...

  5. Salesforce LWC学习(三) import & export / api & track

    我们使用vs code创建lwc 时,文件会默认生成包含 template作为头的html文件,包含了 import LightningElement的 js文件以及对应的.js-meta.xml文件 ...

  6. Data import/export of Netezza using external table

    Introduction External table is a special table in Netezza system, which could be  used to import/exp ...

  7. [Hive - LanguageManual] Import/Export

    LanguageManual ImportExport     Skip to end of metadata   Added by Carl Steinbach, last edited by Le ...

  8. require/exports 和 import/export 区别

    零.区别 1.require/exports 是 CommonJS 的标准,适用范围如 Node.js 2.import/export 是 ES6 的标准,适用范围如 React 一.间接获取对象 ( ...

  9. 前端 高级 (二十五)vue2.0项目实战一 配置简要说明、代码简要说明、Import/Export、轮播和列表例子

    一.启动服务自动打开浏览器运行 二.配置简要说明 1.node_modules 安装好的依赖文件,中间件等,所在位置 2.package.jason 配置当前项目要安装的中间件和依赖文件 { &quo ...

随机推荐

  1. MySQL 清理缓存—flush tablesFlush tables的影响

    摘自:http://blog.chinaunix.net/uid-31401119-id-5781305.html 1  Flush tables简介 官方手册中关于Flush tables的介绍, ...

  2. Rabbitmq | ConnectionException:Connection refused: connect

    案例 今天完成了Rabbitmq的搭建,调用本地mq服务器是可以的,但是在本地调用远程mq发现出现了connectionException异常,使用的是默认端口5672,具体情况如下图 解决方案 修改 ...

  3. SpringBoot之切面AOP

    SpringBoot提供了强大AOP支持,我们前面讲解过AOP面向切面,所以这里具体AOP原理就补具体介绍: AOP切面主要是切方法,我们一般搞一些日志分析和事务操作,要用到切面,类似拦截器: @As ...

  4. 【搞定面试官】- Synchronized如何实现同步?锁优化?(1)

    前言 说起Java面试中最高频的知识点非多线程莫属.每每提起多线程都绕不过一个Java关键字--synchronized.我们都知道该关键字可以保证在同一时刻,只有一个线程可以执行某个方法或者某个代码 ...

  5. Ubuntu下python使用pyenv+virtualenv进行版本和包隔离

    安装pyenv 参考:https://github.com/pyenv/pyenv git clone https://github.com/pyenv/pyenv.git ~/.pyenv echo ...

  6. P4174 [NOI2006]最大获利 (最大权闭合子图)

    P4174 [NOI2006]最大获利 (最大权闭合子图) 题目链接 题意 建\(i\)站台需要\(p_i\)的花费,当\(A_i,B_i\)都建立时获得\(C_i\)的利润,求最大的利润 思路 最大 ...

  7. kendo-ui 几个有用的数据操作

    在工作中发现几个有用的api: 一,grid1.获得grid var grid = $("#proList").data("kendoGrid");2.获得da ...

  8. 第3章 JDK并发包(五)

    3.3 不要重复发明轮子:JDK的并发容器 3.3.1 超好用的工具类:并发集合简介 JDK提供的这些容器大部分在java.util.concurrent包中. ConcurrentHashMap:这 ...

  9. Python原来这么好学-2.1节: 选择PyCharm作为开发工具

    这是一本教同学们彻底学通Python的高质量学习教程,认真地学习每一章节的内容,每天只需学好一节,帮助你成为一名卓越的Python程序员: 本教程面向的是零编程基础的同学,非科班人士,以及有一定编程水 ...

  10. 【WPF学习】第四十六章 效果

    WPF提供了可应用于任何元素的可视化效果.效果的目标是提供一种简单的声明式方法,从而改进文本.图像.按钮以及其他控件的外观.不是编写自己的绘图代码,而是使用某个继承自Effect的类(位于System ...