写个简单js文件,假设名字为:lib.js 。 假设内容如下:

export const sqrt = Math.sqrt;
export function square(x) {return x * x;
}
export function diag(x, y) {return sqrt(square(x) + square(y));
}
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7

这样就可以在其他地方对lib中定义的属性和方法进行引用,引用方法有两种,也就时import和require。

//方法一
import { square, diag } from 'lib';
console.log(square(11)); // 121
console.log(diag(4, 3));
//方法儿
import * as lib from 'lib';
square = lib.square;
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7

还可以设置默认的导出信息,就需要崽lib.js中定义 export default {}。default后面可以接一个参数,也可以接一个数组。书写方法为:

 //------ module1.js ------
export default 123;//------ module2.js ------
const D = 123;
export { D as default };
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6

通常比较习惯用第一种。然后用import就可以得到这个数组或则参数。但是import只能用于静态导入,就是必须在文件开始的时候,在最上层就写好。而require就可以实现动态加载。

加载方式 规范 命令 特点
运行时加载 CommonJS/AMD require 社区方案,提供了服务器/浏览器的模块加载方案。非语言层面的标准。只能在运行时确定模块的依赖关系及输入/输出的变量,无法进行静态优化。
编译时加载 ESMAScript6+ import 语言规格层面支持模块功能。支持编译时静态分析,便于JS引入宏和类型检验。动态绑定。
const incrementCounter = function ({dispatch,state}){dispatch(‘INCREMENT‘)
}
export default {incrementCounter
}
//require
let myAction = require(‘xxxxx‘);
myAction.default.incrementCounter()

es6 import和require用法和区别相关推荐

  1. Javascript(es2016) import和require用法和区别

    require 是赋值过程并且是运行时才执行, import 是解构过程并且是编译时执行.require可以理解为一个全局方法,所以它甚至可以进行下面这样的骚操作,是一个方法就意味着可以在任何地方执行 ...

  2. 路由懒加载import和require用法的区别

    vue-router同步和异步普通用法: // 普通import同步加载用法 import HelloWorld from "@/components/HelloWorld.vue" ...

  3. import和require的区别

    原文地址:https://www.cnblogs.com/sunshq/p/7922182.html import和require的区别 node编程中最重要的思想就是模块化,import和requi ...

  4. import与require的区别

    载入一个模块 import() 与 require() 功能相同,但具有一定程度的自动化特性. 假设我们有如下的目录结构: ~~~ app/ app/classes/ app/classes/MyCl ...

  5. 微信小程序开发之——import、require和include

    一 概述 require:js代码中引用其他js模块代码 include:wxml文件中引用template模板文件 import:既可以在js代码中导入模块代码,又可以在wxml或wxss文件中导入 ...

  6. ES6 import代码智能转换Babel插件: babel-plugin-imports-transform

    babel-plugin-imports-transform ES6 import代码智能转换Babel插件,优化(webpack等)打包构建体积. Github地址: https://github. ...

  7. es6 import 命令

    import 命令 使用export命令定义了模块的对外接口以后,其他 JS 文件就可以通过import命令加载这个模块. // main.js import {firstName, lastName ...

  8. python 捕捉 ctrl+c 异常方法, os._exit() 和 sys.exit() 的用法和区别

    这里写自定义目录标题 python 捕捉 ctrl+c 异常方法 第一种方法 第二种方法使用 signal 模块 python 中 os._exit() 和 sys.exit() 的用法和区别 概述 ...

  9. ES6:export default 和 export 区别

    ES6:export default 和 export 区别 引用:https://blog.csdn.net/zhooson/article/details/78903234 export defa ...

最新文章

  1. ​双十一剁手后,听蒋涛谈谈AI人才多么吸金:2018年社招AI人才平均月薪竟高达4万,算法红利期还有2年
  2. JDK1.6安装与环境变量设置详细图解
  3. 012_HttpServletResponse响应乱码
  4. ajax省市联动案例,AJAX案例四:省市联动(示例代码)
  5. thinkphp mysql 日志_thinkphp5 日志
  6. linux遍历文件目录 链表形式
  7. Java里的class对象 - class object
  8. 小积累-生成固定位数的随机数
  9. js判断对象是否为空或对象的属性是否为空
  10. 计算机考研2017真题408,2017计算机408考研真题‌.pdf
  11. 手机b站封面提取网站_B站视频封面提取网站
  12. 台湾Google云计算计划负责人叶平讲解云计算
  13. 【渝粤教育】国家开放大学2018年秋季 3939T★汽车电控技术 参考试题
  14. Xcode命令行简单了解一下
  15. php怎么插入画笔,ps画笔怎么设置
  16. Mac 序列号不可用导致超时代视频加密视频播放失败
  17. hdu 4043 概率
  18. 侦察系列之IP查询网址推荐
  19. 【Autopsy数字取证篇】Autopsy数字取证软件的下载安装与优化配置
  20. 计算机和共享打印机不在一个网络打印机共享,不在同一个局域网怎么样设置打印机共享...

热门文章

  1. 主要银行监管指标全梳理
  2. hbase和couchdb_使用CouchDB和Groovy的RESTClient进行REST
  3. java计算机毕业设计大学宿舍管理系统源码+系统+lw文档+mysql数据库+部署
  4. 【稳定性day6】大众点评高可用的方法与实践
  5. 【c++】leetcode70 爬楼梯
  6. 青铜三人行之删除链表的倒数第N个节点
  7. 推荐系统笔记(九):SGL --利用自监督对比学习缓解推荐系统长尾效应
  8. rpmforge出错
  9. 食品QS走了,新食品生产许可SC及经营许可JY主内容
  10. roadhog迁移成webpack4问题整理