ES6 笔记(二)- 总结

在最近进行的项目中,已经全面使用到ES6,这里对ES6进行整理总结。用得比较多的是带*的内容,这些语法、新增类型、模块调用等从代码量上、可读性上、操作上给项目带来了不少便利。

1、语法

1.1、命令[***]

a、let:提供块级作用域;不存在变量提升; 暂时性死区;不允许重复声明。

b、const:一旦声明,值不可变;其他同上2-4;仅当前模块可用,跨模块需如下定义:export const A = 1。

c、全局变量:ES6中,var、function生命的全局变量依旧为全局对象的属性;但是let、const、class是声明的全局变量不属于全局对象属性。

1.2、变量的解构赋值[**]

解构类型:数组解构[模式匹配、默认值、按次序匹配]、对象解构[按变量名取值、模式匹配]、字符串、函数。

用途:交换变量、从函数返回多个值、函数参数定义、提取Json数据、函数参数默认值等。

一句话总结:从复杂的结构中提取想要的数据。

1.3、循环(Iterator、for...of)[**]

Iterator:遍历器,它是一种接口,为不同的数据结构提供统一的访问机制。

for...of:部署了Symbol.iterator属性的数据结构,就可以使用for...of进行遍历[ES6新增]。

其中,数组、Set、Map,可以使用entries()、keys()、values()三个方法,调用后返回遍历器接口;其自身也存在遍历器接口。

2、数据变化

2.1、新增数据类型

a、Symbol:

概念:独一无二的值。

方法:查找symbol:

Symbol.for():创建新的symbol;先查找现有symbol是否存在,如果存在则使用现有的;

Symbol():生成新的symbol;

Symbol.keyFor():返回已登记的symbol类型值的key。

应用:消除魔法字符等

b、Set数据结构[***]:相当于无重复值的数组。[并集、交集、差集的实现简单]

WeakSet数据结构:成员只能是对象;其中的对象为弱引用,即垃圾回收机制不考虑。所以,其对象无法引用,weakSet本身也无法遍历。

c、Map数据结构[***]:类似对象,其键值仅为字符串[字符串-值],Map结构的键值可以是任何类型[值-值];

WeakMap:仅对象为键名;且键名所指对象不计入垃圾回收机制。(weap对象随时会被回收)

d、Proxy[对象处理方法]:对目标对象架设“拦截”层,外界的访问需通过“拦截”层。且提供一种机制,对外界的访问进行过滤和改写。

e、Reflect[对象处理方法]:Object的优化对象。

f、二进制数组:该接口的设计目的与WebGl有关,对动画性能有提升[未深入了解]

2.2、数据类型的扩展

a、字符串扩展:主要增加了Unicode的处理方法(双字节字符)

b、正则的扩展:主要增加了修饰符 u[检测Unicode]和 y[相当于带^的g]

c、数值的扩展:主要提供了一些特殊值的处理方法:浮点数差的处理;Math增加了高级方法

d、数组的扩展[**]:提供了创建、填充、查找、遍历数组的方法

e、函数的扩展[***]:提供了参数方法、箭头函数[固定this作用域]、尾调用优化策略等

f、对象的扩展[***]:简写方法、属性名表达式、扩展运算符、属性操作的新方法:assign()、create()、defineProperty()[含ES5]

3、异步相关

3.1、Promise [all、race、then、catch等][***]

特点:对象的状态不受外界影响;

一旦状态改变就不会再变;

优点:可以将异步操作,同步表达出来。

与jquery promise的区别:

(1)ES6 Promise是一个构造函数,jquery Promise为对象;

(2)ES6在new Promise对象时,传入函数,在该函数内部设置resolve、reject[状态不受外界影响];

jquery Promise可以任意位置设置状态。

(3)ES6 Promise的异步处理函数将进入事件循环的任务消息队列,优先级比一般的网络、延时异步更高,且该队列为microtask,将在同一事件循环中得到处理。

3.2、Generator[***]

它是一个状态机、一个遍历器。

通过next方法进行遍历,每次遍历返回一个状态对象{value:, done:boolean};通过状态对象done的状态决定遍历是否结束。且每次暂停位置由yield指令决定。亦可通过for...of进行遍历,返回done为true的value值,而非状态对象。

通过Generator,可按需控制每个yield的执行时机。

3.3、co[**]

其实质是Generator函数的自执行模块。由于Generator自身是一种同步机制,如果存在异步操作,其不会等待异步执行结束,所以无法完成真正的自执行。

而co模块,可通过结合Promise实现Generator的自执行。所以使用co模块的前提条件是,Generator函数的yield命令后面只能是Thunk函数或Promise对象。

应用:

控制页面js执行流,协调ajax、图片资源加载等异步操作及页面渲染的时机。

3.4、async[ES7]

其关键字: async、await, 类似co模块实现的Generator自执行机制,同步执行异步操作。

4、Class[***]

特点:a、类似语法糖,让类的定义更清晰;

b、其prototype不可枚举;

c、继承:extends;

d、使用getter、setter拦截其存取行为。

5、Module模块[***]

设计思想尽量静态化,在编译时加载。

优点:不需要使用UMD模式,服务器、浏览器都将支持。

模块功能主要由:export[输出]和import[输入]命令构成~

模块的继承:export * from ‘circle‘

加载的实质:commonJS模块是值得拷贝,而ES6是值的引用。ES6为动态引用,加载时不去运行js;而commonJS加载时运行。

时间: 2024-10-23 14:27:26

ES6 笔记(二)- 总结的相关文章

ES6笔记二

1.遍历Map结构;任何部署了Iterator接口的对象,都可以用for...of循环遍历.Map结构原生支持Iterator接口,配合变量的结构赋值,获取键名和键值就非常方便.     var map = new Map();     map.set('first', 'hello');     map.set('second', 'world');     for (let [key, value] of map) {       console.log(key + " is " 

ES6笔记(3)-- 解构赋值

系列文章 -- ES6笔记系列 解构赋值,即对某种结构进行解析,然后将解析出来的值赋值给相关的变量,常见的有数组.对象.字符串的解构赋值等 一.数组的解构赋值 function ids() { return [1, 2, 3]; } var [id1, id2, id3] = ids(); console.log(id1, id2, id3); // 1 2 3 如上,解析返回的数组,取出值并赋给相应的变量,这就是解构赋值 1. 还可以嵌套多层,只要相应的模式匹配了就能解析出来 var [a,

老男孩培训视频听课笔记二(在51cto上听的)

centos 5.8 文本安装过程    引导采用默认,引导不用设置密码    网络配置,根据实际情况配置,网关是网络出口的地址,一般为wlan出口的路由器的地址或者是代理服务器的内网IP    DNS简单解说图:      主机名--时区--root密码    选择自定义系统安装包--最小化(安全方便工作,建议安装以下的组)      ·base-- 基础      ·editors-编辑器      ·development librarays--开发库      ·development

《卓有成效的程序员》----读书笔记二

六大方面对比Launchy和TypeAndRun(TAR) 对于快速启动工具,很多人都有自己的偏好,多次听到朋友介绍Launchy的好,虽然自己一直在使用着TAR,还是克制不住对于好软件的渴求,下载Launchy进行试用.很多软件都是有一个试用期的,也许新的软件确实不错,但是你习惯了以前使用的那个软件.今天就比较客观的将Launchy和TAR进行一下对比,从界面.上手速度到功能.自定义,以及软件的稳定性.占用资源进行详细的比较. [界面美观]Launchy:毫无疑问这是它的强项.1.0正式版自带

Caliburn.Micro学习笔记(二)----Actions

Caliburn.Micro学习笔记(二)----Actions 上一篇已经简单说了一下引导类和简单的控件绑定 我的上一个例子里的button自动匹配到ViewModel事件你一定感觉很好玩吧 今天说一下它的Actions,看一下Caliburn.Micro给我们提供了多强大的支持 我们还是从做例子开始 demo的源码下载在文章的最后 例子1.无参数方法调用 点击button把textBox输入的文本弹出来 如果textbox里没有文本button不可点,看一下效果图 看一下前台代码 <Stac

《逻辑思维简易入门》(第2版) 阅读笔记二

<逻辑思维简易入门>(第2版) 阅读笔记二 本周阅读的是<逻辑思维简易入门>的第三章,也就是说,本书的第一部分就已经读完了. 第三章.信念的优点 信念和负信念是人们在接受一个事物时一种心理态度,延伸来说也就是对事物的认知态度.因为我们在研究 逻辑思维的时候,都有一个前提:“以正常情况以及说话者真诚”,所以有人如果对于一件事物不做回应,我们可以认为这是一种既不相信,也不怀疑的的态度. 信念的优缺点有很多,在书中主要介绍了下面几种: 1.准确性 好的信念实在准确的表达事实,同样真的信念

2. 蛤蟆Python脚本学习笔记二基本命令畅玩

2. 蛤蟆Python脚本学习笔记二基本命令畅玩 本篇名言:"成功源于发现细节,没有细节就没有机遇,留心细节意味着创造机遇.一件司空见惯的小事或许就可能是打开机遇宝库的钥匙!" 下班回家,咱先来看下一些常用的基本命令. 欢迎转载,转载请标明出处:http://blog.csdn.net/notbaron/article/details/48092873 1.  数字和表达式 看下图1一就能说明很多问题: 加法,整除,浮点除,取模,幂乘方等.是不是很直接也很粗暴. 关于上限,蛤蟆不太清楚

Emacs 笔记二

Emacs 笔记二 Table of Contents 1. 前言 2. emacs基本操作(常用快捷键) 3. emacs模式讲解 4. emacs缓冲区 5. org mode 5.1. 列表 5.2. 快键键 5.3. 内嵌元素(插入代码什么的) 5.4. 表格 1 前言 最近在学着写博客,发现MarkDown真乃神器,于是去找了很多markdown的工具,发现作业部落 最好的那个,而无意间又发现了org-mode火爆到极致 非常被人推崇,其实作业部落 已经是能很完美的满足我的需求了,但是

《Programming in Lua 3》读书笔记(二十二)

日期:2014.8.6 PartⅣ The C API 26 Extending Your Application 使用Lua很重要的一点是用来做配置语言.配合主语言做一些功能的配置. 26.1 The Basics 有的时候程序需要配置一些功能信息,很多时候可能有许多别的方法比用lua做配置要更简单:如使用环境变量或者读取文件,读取文件涉及到文件的解析.如果使用Lua进行配置的话,相当于用lua文件替代了要读取的如csv.txt文件等. 使用Lua进行配置的时候,就需要使用Lua API去控制

小猪的数据结构学习笔记(二)

小猪的数据结构学习笔记(二) 线性表中的顺序表 本节引言: 在上个章节中,我们对数据结构与算法的相关概念进行了了解,知道数据结构的 逻辑结构与物理结构的区别,算法的特性以及设计要求;还学了如何去衡量一个算法 的好坏,以及时间复杂度的计算!在本节中我们将接触第一个数据结构--线性表; 而线性表有两种表现形式,分别是顺序表和链表;学好这一章很重要,是学习后面的基石; 这一节我们会重点学习下顺序表,在这里给大家一个忠告,学编程切忌眼高手低,看懂不代表自己 写得出来,给出的实现代码,自己要理解思路,自己