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 相关文章推荐
Javascript 检测键盘按键信息及键码值对应介绍
Jan 03 Javascript
如何使用json在前后台进行数据传输实例介绍
Apr 11 Javascript
JS简单实现文件上传实例代码(无需插件)
Nov 15 Javascript
Jquery+asp.net后台数据传到前台js进行解析的方法
May 11 Javascript
Sort()函数的多种用法
Mar 20 Javascript
JavaScript ES5标准中新增的Array方法
Jun 28 Javascript
详解webpack 多入口配置
Jun 16 Javascript
浅谈node.js 命令行工具(cli)
May 10 Javascript
Vue.js更改调试地址端口号的实例
Sep 19 Javascript
JavaScript之scrollTop、scrollHeight、offsetTop、offsetHeight等属性学习笔记
Jul 15 Javascript
js节流防抖应用场景,以及在vue中节流防抖的具体实现操作
Sep 21 Javascript
Vue3实现简易音乐播放器组件
Aug 14 Vue.js
详解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
用Flash图形化数据(二)
2006/10/09 PHP
php 静态化实现代码
2009/03/20 PHP
JQuery 1.6发布 性能提升,同时包含大量破坏性变更
2011/05/10 Javascript
jquery时间下拉框小例子
2013/04/15 Javascript
jQuery教程 $()包装函数来实现数组元素分页效果
2013/08/13 Javascript
js截取固定长度的中英文字符的简单实例
2013/11/22 Javascript
如何判断Javascript对象是否存在的简单实例
2016/05/18 Javascript
JavaScript中误用/g导致的正则test()无法正确重复执行的解决方案
2016/07/27 Javascript
Vue Cli3 创建项目的方法步骤
2018/10/15 Javascript
使用javascript做时间倒数读秒功能的实例
2019/01/23 Javascript
微信小程序实现一张或多张图片上传(云开发)
2019/09/25 Javascript
javascript二维数组和对象的深拷贝与浅拷贝实例分析
2019/10/26 Javascript
Vue自定义指令结合阿里云OSS优化图片的实现方法
2019/11/12 Javascript
[38:32]DOTA2上海特级锦标赛A组资格赛#2 Secret VS EHOME第二局
2016/02/26 DOTA
python多重继承实例
2014/10/11 Python
Python中的模块和包概念介绍
2015/04/13 Python
python获得文件创建时间和修改时间的方法
2015/06/30 Python
剖析Python的Twisted框架的核心特性
2016/05/25 Python
Python实现字符串与数组相互转换功能示例
2017/09/22 Python
python实现Decorator模式实例代码
2018/02/09 Python
Python面向对象程序设计类的封装与继承用法示例
2019/04/12 Python
Python程序打包工具py2exe和PyInstaller详解
2019/06/28 Python
Python数据可视化:顶级绘图库plotly详解
2019/12/07 Python
python实现AdaBoost算法的示例
2020/10/03 Python
利用CSS3的transform做的动态时钟效果
2011/09/21 HTML / CSS
详解CSS3的opacity属性设置透明效果的用法
2016/05/09 HTML / CSS
瑞士男士时尚网上商店:Babista
2020/05/14 全球购物
中软Java笔试题
2012/11/11 面试题
关于Java finally的面试题
2016/04/27 面试题
优良学风班申请材料
2014/02/13 职场文书
银行委托书范本
2014/04/04 职场文书
个人剖析材料范文
2014/09/30 职场文书
校园安全学习心得体会
2016/01/18 职场文书
mysql 直接拷贝data 目录下文件还原数据的实现
2021/07/25 MySQL
Java9新特性之Module模块化编程示例演绎
2022/03/16 Java/Android
python中pycryto实现数据加密
2022/04/29 Python