ES5和ES6对象导出和导入

时间: 2018-07-18阅读: 1381标签: es6

import ... form...替代 require()

  1. //不接收对象
  2. require:require('s.css'); //(es5)
  3. improt 's.css' //(es6)
  4. //接收对象
  5. var o = require('s.js'); //es(5)
  6. import o form s.js //(es6)


对象的写法

  1. 导出一个模块对象(es5):
  2. module.exports={
  3. add:add,
  4. sub:sub
  5. }
  6. 导出一个模块对象(es6):
  7. module.exports={
  8. add,
  9. sub
  10. }
  11. 注意:上es6这种写法属性名和属性值变量是同一个,否则要分开写
  12. module.exprots={
  13. addFn:add,
  14. sub
  15. }


一个对象中方法的写法

  1. //es5
  2. module.exports={
  3. addFun:function(x,y){
  4. return x+y;
  5. }
  6. }
  7. //es6
  8. module.exports={
  9. addFun(x,y){
  10. return x+y;
  11. }
  12. }


导出对象

  1. calc.js中有两个函数:
  2. function add(){}
  3. function sub(){}
  4. //写法一
  5. es5写法:
  6. module.exports.add = add;
  7. module.exports.sub = sub;
  8. es6写法:
  9. exprot function add(){}
  10. exprot function sub(){}
  11. 使用:
  12. var calc = require('./calc.js');
  13. //写法二
  14. es5:
  15. module.exports = {add:add,sub:sub};
  16. es6:
  17. exprot default{
  18. add,sub
  19. }
  20. //表示取得calc.js中所有暴露出来的对象(es6)
  21. import calc from './calc.js'
  22. //只获取到calc.js中的add方法(按需获取)
  23. import {add} from './calc.js'


用export 和import 的写法注意点

  1. 1、如果模块中使用 export default {}

只能通过 import 对象名称 from '模块路径' 

不能通过 import {对象名称} from '模块路径' 


  1. 2、如果使用 import {对象名称} from '模块路径' 导出具体某个对象或者方法名称

需要单独导出对象或者方法:  

export function add(){}
export function sub(){}

使用:

import {add, sub} from '模块路径

直接使用 add,sub方法

注意:不能直接使用 import 对象名称 from '模块路径'


链接: http://www.fly63.com/article/detial/938

ES6 Promise用法详解

Promise是一个构造函数,接受一个参数(Function),并且该参数接受两个参数resolve和reject(分别表示异步操作执行成功后的回调函数、执行失败后的回调函数)

commonjs 与 es6相关Module语法的区别

export 在接口名字与模块内部的变量之间建立了一一对应的关系,export输出的接口; export的写法,除了像上面这样,还有另外一种。export命令除了输出变量,还可以输出函数或类(class)。

ES6箭头函数(Arrow Functions)

箭头函数中的 this 指向的是定义时的对象,而不是使用时的对象;由于 箭头函数没有自己的this指针,通过 call() 或 apply() 方法调用一个函数时,只能传递参数,他们的第一个参数会被忽略

es6 class

构造函数的prototype属性,在 ES6 的“类”上面继续存在。事实上,类的所有方法都定义在类的prototype属性上面。

es6之迭代器

迭代器是被设计专用于迭代的对象,带有特定接口。所有的迭代器对象都拥有 next() 方法,会返回一个结果对象。该结果对象有两个属性:对应下一个值的 value ,以及一个布尔类型的 done

ES6 - let、const、var的区别

为了使JavaScript语言可以用来编写复杂的大型应用程序,成为企业级开发语言,ECMAScript 6.0(简称ES6)在标准中添加了很多新的特性。我们将用几篇文章总结一下ES6标准中一些常用的新特性。本片文章主要讲解ES6中的let、const命令,并区分其与var命令的区别。

ES6新的变量声明方式

在ES6之前,JavaScript是没有块级作用域的,如果在块内使用var声明一个变量,它在代码块外面仍旧是可见的。ES6规范给开发者带来了块级作用域,let和const都添加了块级作用域,使得JS更严谨和规范。

es6数据变更同步到视图层

数据变更同步到视图层有一个很重要的东西就是Proxy,Proxy的作用就是可以隐藏真正的对象,而用户去修改它的代理对象.Proxy可以监听数据的变化,例如

ES6、7、8常用新特性总结(超实用)

ES6常用新特性:let && const、解构赋值、箭头函数、 ...操作符、 iterable类型、类、ES7常用新特性:Array.prototype.includes、Exponentiation Operator(求幂运算)、Object.values/Object.entries

对ES6的yield示例分析

这里主要是对yield关键字的,yield实际上可以看作是一种新的中断机制,大家都知道javascript函数执行是顺序的,中途没有暂停,等待消息只能通过回调或者settimeout等延迟检查来完成。

fly63.com版权所有,内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权,请与小编联系!情况属实本人将予以删除!

广告赞助文章投稿关于web前端网站点搜索站长推荐网站地图站长QQ:522607023

小程序专栏: 土味情话心理测试脑筋急转弯幽默笑话段子句子语录成语大全