30张图带你重温ES6(下)

8,910 阅读2分钟

前言

基础决定上层建筑!最近重温了ES6,我将知识点汇总整理成脑图,一来可以加深印象,二来方便以后查阅

注:本系列分上、下两篇,当前为下篇

上篇传送门:三天三夜,整理了30张高清思维导图 | 带你重温ES6(上)

Set 和 Map数据结构

Set和Map是ES6新增的数据结构,set类似于数组,但里面没有重复的东西,Map类似对象,但是可以键可以是任意数据类型

Set 和 Map 数据结构.png

Proxy

属于一种“元编程”,可以理解成,在目标对象之前架设一层“拦截”,外界对该对象的访问,都必须先通过这层拦截

Proxy.png

Reflect

Reflect也是ES6为了操作对象而提供的新API,但它可以让很多操作变得更易读

Reflect.png

Promise 对象

本质是通过构造函数Promise产生对象,对象里面定义了一系列的方法,利用这些方法可以更好的解决异步回调的问题

Promise 对象.png

Iterator 和 for...of 循环

Iterator是遍历器的意思,它为各种数据结构提供一个统一、简便的访问接口,并利用新增的for of循环可以很方便的实现各种数据的遍历

Iterator 和 for...of 循环.png

Generator 函数

Generator是一种异步解决方案,语法行为与传统函数完全不同

Generator 函数的语法和应用.png

async 函数

async本质上是Generator的语法糖,语义更好且不用手动调用next

async 函数.png

Class

本质是语法糖,大部分功能ES5都可以做到。但是它更语义化了

Class 类.png

Class 的继承

可以通过extends关键字实现继承

Class的继承.png

Module 的语法

ES6 在语言标准的层面上实现了模块化,可以取代之前社区的CommonJS和AMD规范,成为浏览器和服务器通用的模块解决方案

Module 的语法.png

Module的加载实现

可以在script标签中定义type为"module",表示里面是关于模块化的一些东西。但是注意都是异步加载

Module 的加载实现.png

编程风格

一些大厂的编程风格,可借鉴

编程风格.png

读懂规格

规格文件是计算机语言的官方标准,详细描述语法规则和实现方法,当你遇到疑难的语法问题,实在找不到答案,这时可以去查看规格文件

读懂规格.png

异步遍历器

ES2018 引入了“异步遍历器”,为异步操作提供原生的遍历器接口,即value和done这两个属性都是异步产生

异步遍历器.png

ArrayBuffer

是JavaScript操作二进制数据的接口

ArrayBuffer.png

最新提案

一些更新的东西

image.png

Decorator

装饰器是与类相关的语法,可用于修改类和类方法

Decorator.png

end~

以上就是这次整理的结果,希望对你有帮助!

未经本人许可,禁止转载

欢迎点赞、收藏,如有疑问欢迎下方留言~