不积跬步,无以至千里【4】【ES6】

1. let、const、var的区别

 

2. 块级作用域

块作用域由 { }包括,let和const具有块级作用域,var不存在块级作用域。块级作用域解决了ES5中的两个问题:
内层变量可能覆盖外层变量
用来计数的循环变量泄露为全局变量

 

3. 暂时性死区

在使用let、const命令声明变量之前,该变量都是不可用的。这在语法上,称为暂时性死区 let a = a/const a = a(会报错)

 

4. 解构赋值

5. 箭头函数和普通函数的区别(this的指向)

a、箭头函数没有自己的this

箭头函数不会创建自己的this, 所以它没有自己的this,它只会在自己作用域的上一层继承this。

所以箭头函数中this的指向在它在定义时已经确定了,之后不会改变。

b、call()、apply()、bind()等方法不能改变箭头函数中this的指向

箭头函数的this指向要么是window,要么是他的外层

c、箭头函数没有自己的arguments

箭头函数没有自己的arguments对象。在箭头函数中访问arguments实际上获得的是它外层函数的arguments值。

 

6. Symbol概念和作用

数据类型,不是函数,表示不会重复的值

--------------------

7. Set和Map数据结构

7.1、Set

a、概念

ES6 提供了新的数据结构 Set(集合)(是一个对象类型)。它类似于数组,但成员的值都是唯一的,

集合实现了 iterator 接口,所以可以使用『扩展运算符』(…)和『for…of…』进 行遍历

b、集合的属性和方法

size:返回集合的元素个数
add增加一个新元素,返回当前集合(一次只能加一个)
delete删除一个元素,返回Boolean值
has 检测集合中是否包含某个元素,返回 boolean 值
clear 清空集合,返回 undefined

 

7.2、Map

a、概念

ES6 提供了 Map 数据结构。它类似于对象,也是键值对的集合。

但是“键” 的范围不限于字符串,各种类型的值(包括对象)都可以当作键。

Map 也实现了 iterator 接口,所以可以使用『扩展运算符』和『for…of…』进行遍历。

若给map赋初始值,可以以数组形式,数组里面的也都为数组形式:const m = new Map([array(2),array(2)]);这样形成一个对象中包含两对键值对,

第一个数组中前一个为键名,后一个为键值,第二个数组同理。

 

b、Map的属性和方法

size 返回 Map 的元素个数(键值对个数)
set 增加一个新元素,返回当前 Map
delete 删除键值对,返回boolean 值
get 返回键名对象的键值
has 检测 Map 中是否包含某个元素,返回 boolean 值
clear 清空集合,返回 undefined

 

8. weakset 与WeakMap

weakset  WeakSet 只能储存对象引用,不能存放值,而 Set 对象都可以。

WeakMap 对象也是一组键值对的集合,其中的键是弱引用的。其键必须是对象,原始数据类型不能作为key值,而值可以是任意的

 

 

 

 

9. Proxy

--------------------

10.Promise(Promise的链式调用,Promise的状态、Promise的方法)

10.1、在构造 Promise 的时候,构造函数内部的代码是立即执行的

Promise本身是同步的立即执行函数,当在executor中执行resolve()或者reject()的时候, 此时是异步操作,也就是说promise中函数体内部的非异步操作正常顺序执行,resolve()和reject()异步操作为promise实例对象的返回结果,这个返回结果后面的then或者catch需要用,所以then和catch要放到异步任务中等待所有同步任务执行完毕之后再按顺序(或者如果有定时器,需要遵循定时器的时间)执行。

10.2、Promise是异步编程的一种解决方案   解决了地狱回调的问题

它是一个对象,可以获取异步操作的消息,他的出现大大改善了异步编程的困境,避免了地狱回调,它比传统的解决方案回调函数和事件更合理和更强大。

所谓Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果。

从语法上说,Promise 是一个对象,从它可以获取异步操作的消息。Promise 提供统一的 API,各种异步操作都可以用同样的方法进行处理

 

10.3、Promise的实例有三个状态     无法取消Promise,一旦新建它就会立即执行,无法中途取消

Pending(进行中)
Resolved(已完成)
Rejected(已拒绝)

 

10.4、Promise的实例有两个过程  一旦从进行状态变成为其他状态就永远不能更改状态了

pending -> fulfilled : Resolved(已完成)
pending -> rejected:Rejected(已拒绝)

 

10.5、原型方法  then、catch、finally、all、race

a、它的原型上定义了一个 then 方法,使用这个 then 方法可以为两个状态的改变注册回调函数。这个回调函数属于微任务,会在本轮事件循环的末尾执行

b、all()方法
Promise.all([p1,p2...])
---all方法可以完成并行任务, 它接收一个数组,数组的每一项都是一个promise对象。

---当数组中所有的promise的状态都达到resolved的时候,all方法的状态就会变成resolved,如果有一个状态变成了rejected,那么all方法的状态就会变成rejected
---当所有的子Promise都成功完成,该Promise完成,返回值是全部值的数组,这个数组按顺序保存着每一个promise对象resolve执行时的值
---如果有任何一个失败,该Promise失败,返回值是第一个失败的子Promise的结果

 

c、race()方法
Promise.race([p1,p2...])
---race方法和all一样,接受的参数是一个每项都是promise的数组,但是与all不同的是,当最先执行完的事件执行完之后,就直接返回该promise对象的值。

---如果第一个promise对象状态变成resolved,那自身的状态变成了resolved;反之第一个promise变成rejected,那自身状态就会变成rejected

实际应用:
race 就是赛跑的意思,意思就是说,Promise.race([p1, p2, p3])里面哪个结果获得的快,就返回那个结果,

不管结果本身是成功状态还是失败状态。当要做一件事,超过多长时间就不做了,可以用这个方法来解决

 

 

 

10.6、Promise的特点

a、对象的状态不受外界影响。

promise对象代表一个异步操作,有三种状态,pending(进行中)、fulfilled(已成功)、rejected(已失败)。只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态,这也是promise这个名字的由来——“承诺”


b、一旦状态改变就不会再变,任何时候都可以得到这个结果。

promise对象的状态改变,只有两种可能:从pending变为fulfilled,从pending变为rejected。这时就称为resolved(已定型)。如果改变已经发生了,你再对promise对象添加回调函数,也会立即得到这个结果。这与事件(event)完全不同,事件的特点是:如果你错过了它,再去监听是得不到结果的

 

10.7、Promise的缺点

无法取消Promise,一旦新建它就会立即执行,无法中途取消
如果不设置回调函数,Promise内部抛出的错误,不会反应到外部
当处于pending状态时,无法得知目前进展到哪一个阶段(刚刚开始还是即将完成)

 

11.Generator及其异步方面的应用

 

12.async函数和await

12.1、async

async函数返回的是一个Promise 对象,如果在函数中 return 一个直接量,async 会把这个直接量通过 Promise.resolve() 封装成 Promise 对象,async 函数返回的是一个 Promise 对象,所以在最外层不能用 await 获取其返回值的情况下,当然应该用原来的方式:then() 链来处理这个 Promise 对象


async函数返回的是一个promise对象: 

 

 


可以用then()方法或者catch()方法来处理async函数(promise对象):

 

 

 

 

 

 

12.2、async/await其实是Generator 的语法糖,它能实现的效果都能用then链来实现,它是为优化then链而开发出来的。从字面上来看,async是“异步”的简写,await则为等待,所以很好理解async 用于申明一个 function 是异步的,而 await 用于等待一个异步方法执行完成。

 

12.3、promise(async函数)异步任务只针对promise(async函数)中调用的then()方法或者catch()方法等里面的函数执行,promise(async函数)中的同步任务正常执行,不会阻塞,此时then或者catch方法里面的代码会放到异步任务队列中,待页面所有同步任务完成后再按照顺序(或时间顺序)执行

 

 

12.4、有await的async函数,会暂时阻碍await下面所有代码的执行,在async函数中并且在await前面的代码(以及await紧跟着的那个异步函数也会正常运行)会正常运行,待await等待到他后面异步函数的结果之后,再执行await下面的代码。

注意:await在没有等待到它后面的异步函数的结果时只是阻碍async函数中且在await下面的代码的执行,

async函数中且在await前面、await后面紧跟着的那个异步任务的代码,以及async函数之后的代码不会受到影响,会正常运行

 

 

13. class基本语法及继承

https://blog.csdn.net/Slueia/article/details/110395517

 

14. 模块加载方案比较(CommonJS和ES6的Module) 

不同点
1.CommonJS 模块是运行时加载,ES6 模块是编译时输出接口。
2.CommonJS 模块的require()是同步加载模块,ES6 模块的import命令是异步加载
3.CommonJS是对模块的浅拷贝,ES6 Module是对模块的引入,即ES6 Module只存只读,不能改变其值,具体点就是指针指向不能变,类似const 。
4.import的接口是read-only(只读状态),不能修改其变量值。 即不能修改其变量的指针指向,但可以改变变量内部指针指向。可以对commonJS重新赋值(改变指针指向),但是对ES6 Module赋值会编译报错。


相同点
CommonJS和ES6 Module都可以对引⼊的对象进行赋值,即对对象内部属性的值进行改变

 

15. Iterator和for...of(Iterator遍历器的实现)

https://blog.csdn.net/weixin_40013817/article/details/103400007

 

posted on   二月龙抬头之伏龙翔天  阅读(181)  评论(0编辑  收藏  举报

相关博文:
阅读排行:
· 在鹅厂做java开发是什么体验
· 百万级群聊的设计实践
· WPF到Web的无缝过渡:英雄联盟客户端的OpenSilver迁移实战
· 永远不要相信用户的输入:从 SQL 注入攻防看输入验证的重要性
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析

导航

< 2025年2月 >
26 27 28 29 30 31 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 1
2 3 4 5 6 7 8

统计

点击右上角即可分享
微信分享提示