ES5和ES6对象导出和导入(转载,待整理)
- 1、import ... form...替代 require()
//不接收对象
require:require('s.css'); //(es5)
improt 's.css' //(es6)
//接收对象
var o = require('s.js'); //es(5)
import o form s.js //(es6)
- 2、对象的写法
导出一个模块对象(es5):
module.exports={
add:add,
sub:sub
}
导出一个模块对象(es6):
module.exports={
add,
sub
}
注意:上es6这种写法属性名和属性值变量是同一个,否则要分开写
module.exprots={
addFn:add,
sub
}
- 3、一个对象中方法的写法
//es5
module.exports={
addFun:function(x,y){
return x+y;
}
}
//es6
module.exports={
addFun(x,y){
return x+y;
}
}
- 4、导出对象
calc.js中有两个函数:
function add(){}
function sub(){}
//写法一
es5写法:
module.exports.add = add;
module.exports.sub = sub;
es6写法:
exprot function add(){}
exprot function sub(){}
使用:
var calc = require('./calc.js');
//写法二
es5:
module.exports = {add:add,sub:sub};
es6:
exprot default{
add,sub
}
//表示取得calc.js中所有暴露出来的对象(es6)
import calc from './calc.js'
//只获取到calc.js中的add方法(按需获取)
import {add} from './calc.js'
- 5、用export 和import 的写法注意点
1、如果模块中使用 export default {}
只能通过 import 对象名称 from '模块路径'
不能通过 import {对象名称} from '模块路径'
2、如果使用 import {对象名称} from '模块路径' 导出具体某个对象或者方法名称
需要单独导出对象或者方法:
export function add(){}
export function sub(){}
使用:
import {add, sub} from '模块路径'
直接使用 add,sub方法
注意:不能直接使用 import 对象名称 from '模块路径'
export default 和 export 区别
- 1 、export与export default均可用于导出常量、函数、文件、模块等
- 2、你可以在其它文件或模块中通过import+(常量 | 函数 | 文件 | 模块)名的方式,将其导入,以便能够对其进行使用
- 3、在一个文件或模块中,export、import可以有多个,export default仅有一个
- 4、通过export方式导出,在导入时要加{ },export default则不需要
1.export
//a.js
export const str = "blablabla~";
export function log(sth) {
return sth;
}
对应的导入方式:
//b.js
import { str, log } from 'a'; //也可以分开写两次,导入的时候带花括号
2.export default
//a.js
const str = "blablabla~";
export default str;
对应的导入方式:
//b.js
import str from 'a'; //导入的时候没有花括号
使用export default命令,为模块指定默认输出,这样就不需要知道所要加载模块的变量名
//a.js
let sex = "boy";
export default sex(sex不能加大括号)
//原本直接export sex外部是无法识别的,加上default就可以了.但是一个文件内最多只能有一个export default。
其实此处相当于为sex变量值"boy"起了一个系统默认的变量名default,自然default只能有一个值,所以一个文件内不能有多个export default。
// b.js
本质上,a.js文件的export default输出一个叫做default的变量,然后系统允许你为它取任意名字。所以可以为import的模块起任何变量名,且不需要用大括号包含
import any from "./a.js"
import any12 from "./a.js"
console.log(any,any12) // boy,boy
链接:https://www.jianshu.com/p/0e84f5e6866d
ES5和ES6对象导出和导入(转载,待整理)的更多相关文章
- ES3、ES5、ES6对象代理的写法差异
ES3的对象代理写法: console.log('定义私有变量ES3写法:') // ES3 var Person = function (){ var data = { name:'ES3', ag ...
- ES5与ES6常用语法教程之 ①函数写法、创建对象、导入导出模块方式
函数写法区别 计算a, b两个数字之和,有返回值 es5 写法 function add(a, b) { return a + b; } es6 写法(箭头函数) let add = (a, b) = ...
- LOB对象在数据泵导出、导入后查询对象数量发现丢失
问题描述:问题:源库的某个Schema使用数据泵Expdp元数据整体导出,在目标库导入且成功后,逻辑验证用户对象,发现缺失.分析查询后,缺失的对象,都是LOB类型(并不是所有的LOB都无法导入,是大部 ...
- React Native的语法之ES5和ES6
原文地址:http://www.devio.org/2016/08/11/React-Native%E4%B9%8BReact%E9%80%9F%E5%AD%A6%E6%95%99%E7%A8%8B- ...
- react-native ES5与ES6写法对照表
转载链接:http://www.ncloud.hk/%E6%8A%80%E6%9C%AF%E5%88%86%E4%BA%AB/react-native-es5-and-es6-writing-tabl ...
- .Net程序员学用Oracle系列(19):我知道的导出和导入
1.传统的导出/导入工具 1.1.EXP 命令详解 1.2.IMP 命令详解 1.3.EXP/IMP 使用技巧 2.新的导出/导入工具 2.1.EXPDP/IMPDP 参数说明 2.2.EXPDP/I ...
- JavaScript、ES5和ES6的介绍和区别
JavaScript由三部分组成: ECMAScript(核心) DOM(文档对象模型) BOM (浏览器对象模型) ES5(ECMAScript第五个版本) strict模式 严格模式,限制一些用法 ...
- .Net程序员学用Oracle系列(19):导出、导入(备份、还原)
1.传统的导出/导入工具 1.1.EXP 命令详解 1.2.IMP 命令详解 1.3.EXP/IMP 使用技巧 2.新的导出/导入工具 2.1.EXPDP/IMPDP 参数说明 2.2.EXPDP/I ...
- 多角度对比 ES5与ES6的区别
ES5与ES6的对比不同点整理 本文关键词:ES6,javascript, 1.Default Parameters(默认参数) es6之前,定义默认参数的方法是在一个方法内部定义 var link ...
随机推荐
- gcc库链接
转载于https://blog.csdn.net/zhangdaisylove/article/details/45721667 1.库的分类 库有静态库和动态库,linux下静态库为.a,动态库为. ...
- Linux 小知识翻译 - 目录 (完结)
偶尔在网上看到的这篇文章,总结了linux中一些天天在说的概念.可能是因为天天说的关系, 一直以为自己知道这些概念.其实对有些概念也只是似是而非的了解而已. 为此,决定将所有的小知识点全翻译下来,给自 ...
- C++添加热键和捕获组合键
一.热键注册 步骤一:声明一个全局量int hotkeyId=1: 步骤二:窗体创建的时候注册: int result= RegisterHotKey(this->GetHWND(), hotk ...
- mybatis的xml映射文件
1,在进行统计查询时候,不想写映射的实体类,这时候设置返回的resultType类型是map <select id="getMap" resultType="jav ...
- 基于canvas图像处理的图片 灰色图像
图片展示网页往往色彩繁杂,当一个网页上有多张图片的时候用户的注意力就很不容易集中,而且会造成网站整个色调风格的不可把控. 能不能把所有的预览图变成灰度图片,等用户激活某张图片的时候再上色呢? 以前,唯 ...
- metamask-mascara-在线钱包使用
网址为:https://wallet.metamask.io 这是一个在线钱包,可以看见,它是一个测试版的 输入你自己设置的一个密码,然后create 接着就会进入下面这个页面,然后next: 然后a ...
- LoadRunner 11安装Micosoft Visual C++ 2005 SP1时提示命令行选项语法错误
如果安装LoadRunner 11时弹窗提示"Micosoft Visual C++ 2005 SP1 可再发行组件包(X86):'命令行选项语法错误.键入命令 / ? 可获得帮助信息'&q ...
- Shell获取指定时间
时区基本知识 相差一个时区(经度15度)时间相差一小时.简单计算口诀:1.同一个时区的相差时间用减法,2.不同时区的相差时间用加法.3东加西减.例如一,东八区是8点,问东1区几点.根据上面口诀1,算: ...
- QT 布局管理器的使用
很多的时候,需要布局管理器的使用, 在此介绍一下布局管理器的使用,直接上代码 #include "widget.h" #include "ui_widget.h" ...
- 通过重建清理SVN服务器无用目录,不丢失其他目录修改记录
1.主要时有时间希望调整一些文件的目录结构,或者移除一个大量占用空间的文件节省服务器磁盘,但是又不希望调整后,对应的修改记录丢失.这时可以通过服务器目录重建实现. 2.重建后只是被排除掉的目录的修改记 ...