Javascript(es2016) import和require用法和区别详解


Posted in Javascript onAugust 11, 2017

本文介绍了Javascript(es2016) import和require用法和区别详解,分享给大家,具体如下:

写个简单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));
}

这样就可以在其他地方对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;

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

//------ module1.js ------
export default 123;

//------ module2.js ------
const D = 123;
export { D as default };

通常比较习惯用第一种。然后用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()

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
在UpdatePanel内jquery easyui效果失效的解决方法
Apr 11 Javascript
《JavaScript高级程序设计》阅读笔记(三) ECMAScript中的引用类型
Feb 27 Javascript
关于textarea提交的内容无法换行的解决办法
Apr 09 Javascript
浅谈被jQuery抛弃的函数及替代函数
May 03 Javascript
jQuery链式操作实例分析
Nov 16 Javascript
全国省市二级联动下拉菜单 js版
May 10 Javascript
判断输入的字符串是否是日期格式的简单方法
Jul 11 Javascript
微信小程序 特效菜单抽屉效果实例代码
Jan 11 Javascript
DOM事件探秘篇
Feb 15 Javascript
JavaScript模拟实现自由落体效果
Aug 28 Javascript
Vue-cli@3.0 插件系统简析
Sep 05 Javascript
JavaScript中遍历的十种方法总结
Dec 15 Javascript
详解Node中导入模块require和import的区别
Aug 11 #Javascript
vue实现单选和多选功能
Aug 11 #Javascript
js微信应用场景之微信音乐相册案例分享
Aug 11 #Javascript
Angular模板表单校验方法详解
Aug 11 #Javascript
AngularJs导出数据到Excel的示例代码
Aug 11 #Javascript
Vue 表单控件绑定的实现示例
Aug 11 #Javascript
Angular4实现动态添加删除表单输入框功能
Aug 11 #Javascript
You might like
全国FM电台频率大全 - 9 上海市
2020/03/11 无线电
根德Grundig S400/S500/S700电路分析
2021/03/02 无线电
Windows下安装PHP单元测试环境PHPUnit图文教程
2014/10/24 PHP
php结合正则批量抓取网页中邮箱地址
2015/05/19 PHP
php实现批量删除挂马文件及批量替换页面内容完整实例
2016/07/08 PHP
php安装扩展mysqli的实现步骤及报错解决办法
2017/09/23 PHP
js 屏蔽鼠标右键脚本附破解方法
2009/12/03 Javascript
基于jquery的无限级联下拉框js插件
2011/10/29 Javascript
JavaScript全排列的六种算法 具体实现
2013/06/29 Javascript
利用jq让你的div居中的好方法分享
2013/11/21 Javascript
轻松创建nodejs服务器(10):处理POST请求
2014/12/18 NodeJs
JavaScript中的方法调用详细介绍
2014/12/30 Javascript
jQuery中find()方法用法实例
2015/01/07 Javascript
jQuery实现移动端滑块拖动选择数字效果
2015/12/24 Javascript
浅谈js常用内置方法和对象
2016/09/24 Javascript
利用JS判断鼠标移入元素的方向
2016/12/11 Javascript
js canvas实现擦除效果示例代码
2017/04/26 Javascript
Vue中el-form标签中的自定义el-select下拉框标签功能
2020/04/20 Javascript
vue-model实现简易计算器
2020/08/17 Javascript
鸿蒙系统中的 JS 开发框架
2020/09/18 Javascript
Python处理文本换行符实例代码
2018/02/03 Python
Python+Django搭建自己的blog网站
2018/03/13 Python
python控制windows剪贴板,向剪贴板中写入图片的实例
2018/05/31 Python
芬兰设计商店美国:Finnish Design Shop US
2019/03/25 全球购物
adidas瑞典官方网站:购买阿迪达斯鞋子和运动服
2019/12/11 全球购物
网吧收银员岗位职责
2013/12/14 职场文书
本科生职业生涯规划书范文
2014/01/21 职场文书
应届毕业生通用的自荐书范文
2014/02/07 职场文书
三关爱志愿服务活动方案
2014/08/17 职场文书
员工培训协议书
2014/09/15 职场文书
单位法人授权委托书范本
2014/10/09 职场文书
教师节校长致辞
2015/07/31 职场文书
《认识年月日》教学反思
2016/02/19 职场文书
Java基础之详解HashSet的使用方法
2021/06/30 Java/Android
Java基础-封装和继承
2021/07/02 Java/Android
剖析后OpLog订阅MongoDB的数据变更就没那么难了
2022/02/24 MongoDB