美文网首页
ES6总结文档

ES6总结文档

作者: 李先生Mr_Li | 来源:发表于2018-07-27 10:18 被阅读0次

数组的拓展方法:

arr.keys()方法: 获取数组的所有索引值 chrome没有实现

arr.values()方法: 获取数组的所有成员值chrome没有实现

arr.entries()方法:

作用:   获取数组所有索引值以及成员值

返回:  数组迭代器对象

使用for fo方法遍历此对象可获得数组

第一个成员表示索引值

第二个成员表示成员值

数组迭代器特征:

遍历数组迭代器内容, 只能使用for of方法,  for循环,  for in无效

可以通过next方法包含每一个值的对象

数组迭代器只能被获取一次

对象的复制:

jq中的extend(any)方法:

作用: jQuery中复制对象的方法

参数: @any    如果是true表示深复制(此时后面的参数表示需要复制的对象,可多个),   如果是对象表示浅复制

返回值:  复制的对象(如果复制的是多个对象,  多个对象会合并到一起)

window.assign(obj1,  obj2...)方法:   (浅复制)

作用: 扩展对象, 将别的对象的值复制给目标对象

参数:

@obj1    目标对象

@obj2... 被复制的对象(可多个)   

返回值:  拓展后的目标对象(@obj1), 若有同名属性, 后面的覆盖前面的

Symbol数据类型:      ES6新增数据类型

应用:   为一个库添加属性、方法,  是很危险的,原因新增的属性、方法可能会替换掉原有的属性或者方法,原理就是名称可能会同名,es6新增symbol数据类型是为了解决这个问题,通过symbol新增的属性是永远不会同名的

使用Symbol类型的值不会被覆盖:

语法: var  key =  Symbol(value)

注意:  一旦通过Symbol类型为对象添加属性, 访问这个属性值, 只能通过变量名访问

例如:  {Symbol(value): "red"},   

访问属性值只能使用obj[key],  key表示Symebol(value)的变量名

obj[Symbol(value)] 这种写法访问不到该属性

代理对象:

应用:   不允许用户直接访问一些隐私数据, 而是通过代理对象访问, 通过代理对象屏蔽一些危险操作.

创建代理对象: new Proxy(obj, configObj)    

@obj  被代理的对象

@dealObj   处理代理对象的接口方法对象

get(obj,  key)    用户获取对象属性时的处理方法

@obj    被代理的对象

@key    获取的属性名

set(obj, key, value)   用户设置对象属性时的处理方法

@obj   被代理的对象

@key   被设置的对象属性名称

@value  用户设置的属性值 

默认参数:

ES6允许我们在参数中使用赋值符号,定义默认参数

例如:   function drawColor(color = 'green'){}

获取剩余参数:

应用:  箭头函数中不能使用arguments,  可以使用...arg语法代替

语法: ...arg

例如:  function  drawColor(color1, color2, ...color){}

前面的参数可以正常使用

获取的color变量是一个数组

解构:

解构对象:

作用:  直接使用变量名调用对象的属性

语法: var {属性名称} = 对象

大括号内的属性名称必须要与对象的属性名称一致

例如:  var {Model, Controller, View} = Backbone;

解构数组:

作用: 可以将一个数组的每个成员转化成函数参数

语法:  var [变量1, 变量2, ...变量们] = 数组

每个变量表示一个成员

如果想获取所有剩余成员可以使用...语法,获得的是一个数组

例如: var [color1, color2, ...color] = ["red", "green", "blue", "pink"] ;

箭头函数:

定义语法:  () => {}    

() 内定义参数集合

=>箭头

{} 函数体

特征:

不能使用arguments

作用域和箭头函数所在的作用域一致

不能作为构造函数使用(因为第二条)

省略:

只有一个参数, 小括号可以省略

函数体只有返回值, 大括号可以省略, return可以省略

更改作用域:  只能更改箭头函数所在的作用域, 来达到更改箭头函数作用域的目的

Set对象:

ES6中聚合类数据一共有四种: 数组、对象、set对象、map对象

创建set对象:

语法:new Set(arr);

参数:  @arr是一个数组, 会自动对数组中每一个成员去重

返回:  set实例化对象

add(any)方法:

作用:  为set对象添加成员

参数:  只能接收一个参数, 表示添加的成员,  会自动去重

返回值:   set对象, 因此可以链式调用

delete(any)方法:

作用:  删除set对象的成员

参数: 只能接收一个参数, 表示删除的成员

返回值:  布尔值, true表示删除成功

has(any)方法:

作用:  查询是否拥有某个成员

参数:  只能接收一个参数, 表示查询的成员

返回值: 布尔值, true表示存在

clear()方法:

作用: 清空set对象

forEach(fn)方法: 此方法的回调函数的参数和全局的forEach不一样

作用: 遍历set对象

参数:  @fn 回调函数

参数1  表示值

参数2  表示值

参数3  表示set对象

返回值:  undefined

size()方法:  获取对象长度

set对象实现了迭代器接口, 所以可以通过for of遍历

WeakSet对象: 弱set对象, 因为不能被内存回收机制回收, 所以不建议使用

Map对象:

作用:  Map对象是对象的扩展, 允许属性名称是任何类型, 如: null、undefined、数字等等

创建Map对象:

语法:new Map()

对象方法:

set(key, value)方法:

作用: 为map对象添加新属性

参数: @key  属性名称  @value  属性值

返回值:  map对象, 因此可以链式调用

get(key)方法:

作用: 获取map对象中某个属性值

参数: @key 属性名称

返回值:  @key的属性值

clear()方法: 清空map对象

has(key)方法:

作用:  判断某个属性值是否存在

参数:  @key  属性名称

返回值:  布尔值,  true表示存在

delete(key)方法:

作用: 删除讴歌属性值

参数: @key  属性名称

返回值: 布尔值,  true表示删除成功

forEach(fn)方法:

作用: 遍历map对象

参数: @fn  回调函数

参数1   value

参数2   key

参数3   map对象

作用域:  全局

size():  获取长度

WeakMap对象:弱map对象, 不能被内存回收机制回收, 少用

迭代器:

ES6中实现了迭代器接口, 但是没有实现迭代器对象Iterator

迭代器应用:

数据解构、数组解构、对象解构

定义map对象、set对象

使用for of循环

实现了迭代器接口的数据(实现迭代器接口的特征是能否实现for of循环)

Generator函数:

作用:   储存状态

语法:  function * 函数名称() {}

定义状态:

语法: yield  状态内容;

每一个yield定义一个状态, 最后一个状态用return定义

函数运行后得到一个状态对象:

状态对象实现了迭代器接口, 因此可以通过for of循环遍历, 但遍历不到最后一个状态(return)

可以使用next访问状态

返回值: 一个对象

done表示是否完成遍历

value表示状态的值

例子:

// 定义generator函数

function * dayState () {

// 定义状态

yield '睁眼';

yield '砸闹钟';

yield '接着再睡';

yield '再睁眼';

yield '起来了';

yield '上学';

yield '学习';

// 睡觉是最后一个状态

return '睡觉';

}

// 使用generator函数必须执行

var ds = dayState();

// 访问状态

console.log(ds.next())

Promise对象:  允诺对象

作用: 将一部操作转化成同步的写法

promise对象内部维护一个状态,  有三种情况:

rending    异步执行的操作还没有接触

resolved   异步操作已经执行完成

rejected    异步操作执行失败

promise三种情况, 只能存在两种状态的转化,  因此只能出现两个状态:

pending  进入 resolved,  异步操作执行成功

pending  进入 rejected,   异步操作执行失败

创建对象: new Promise(fn);

参数: @fn  回调函数

参数1(一般命名为resolve)  用来将pending状态转换成resolved状态

参数2(一般命名为reject)     用来将pending状态转换成rejected状态

作用域:  全局

在回调函数中执行异步操作,当执行完毕, 会触发相应的状态改变

可以在promise实例化对象中通过then方法绑定回调函数

then(successFn, errFn)方法:

作用:  触发状态是做的事

参数:

@successFn成功时执行的回调函数

@errFn            失败时执行的回调函数

这两个回调函数的参数是执行resolve或reject方法时传递的参数

all方法:

作用:  监听多个允诺对象

如果一个失败了就立即执行失败回调函数

如果都成功了, 执行成功时的回调函数

相关文章

  • ES6总结文档

    数组的拓展方法: arr.keys()方法: 获取数组的所有索引值chrome没有实现 arr.values()方...

  • Ant Design Pro的知识储备

    Less 笔记 Less 官方文档 ReactJs笔记 ReactJs官方文档 ES6笔记 ES6文档 dvaJs...

  • ES6 Promise 对象

    参考文档: 《ECMAScript 6 入门》:Es6 APi Promise对象 《Es6 Prom...

  • react native 入门基础

    参考文档 官方文档开源项目[es6写法](React/React Native 的ES5 ES6写法对照表)七天学...

  • React Native 入门相关文档

    React Native 入门相关文档 官方文档 中文版官方文档 FlexBox讲解 ES5\ES6语法 官方文档...

  • 充电站

    一、前端 ES6教程-菜鸟教程 React官方文档-中文 Vue官方文档-中文 Antd UI组件官方文档 ECh...

  • ES6

    ES6语法使用总结

  • ES6 总结 第二章

    ES6总结 第二章

  • ES6 Study Notes

    ES6 Study Notes 在线文档: http://es6.ruanyifeng.com/#README离线...

  • javascript 的组成

    JavaScript的组成: 核心:ECMAScript(ES6)文档对象模型:Document Object M...

网友评论

      本文标题:ES6总结文档

      本文链接:https://www.haomeiwen.com/subject/cpswmftx.html