ES7、ES8
本文主要介绍 Javascript ES7、ES8 语法特性，为初学 JS 时期整理的笔记，格式较为混乱，待二次整理。
ES7
includes()
用来判断数组是否包含一个指定的值，包含返回true，否则false
指数操作符
指数操作符[**]，用于实现幂运算，功能Math.pow结果相同
console.log(3 ** 3) // 3*3*3 = 27ES8
async和await
async和await两种语法结合可以
让异步代码像同步代码一样，本质是Promise的语法糖
async函数
1.async异步函数的返回值为
Promise对象2.Promise对象的结果由async函数的返回值决定，一共有3种情况
1.返回结果不是一个Promise类型对象时，返回的结果就是成功的Promise对象
return 'error'2.抛出错误，返回的是一个失败的Promise
throw new Error('error')3.返回的结果是一个Promise对象时，函数的返回结果也成功，函数的返回值即是Promise对象的值
return new Promise((resolve, reject) => { resolve('success') })3.返回值为Promise对象，可使用
then()，但方法同原生有差，需加()执行再then()4.箭头函数也可以添加async
async function fn(){
// 1.返回结果不是一个Promise类型对象时，返回的结果就是成功的Promise对象
// return 'error'
// 2.抛出错误，返回的是一个失败的Promise
// throw new Error('error')
// 3.返回的结果是一个Promise对象时，函数的返回结果也成功，函数的返回值即是Promise对象的值
return new Promise((resolve, reject) => {
resolve('success')
})
}
const res = fn()
res.then(value => { // 返回的是一个Promise对象
console.log(value)
},reason => {
console.log(reason)
}
)await表达式
1.await要放在async函数中，单向依赖，async可以没有await
2.await右侧的表达式一般为promise对象
3.await的返回值是promise成功的值
4.await的promise失败了，会抛出异常，需要通过try...catch捕获处理
5.
引擎在遇到await时会等待直到Promise状态完成并返回结果
const p = new Promise((resolve, reject) => {
reject('error')
})
async function main() {
try {
let res = await p
console.log(res)
} catch (e) {
console.log(e)
}
}
main()拓展与理解
1.多个await，会打破操作的并行，容易造成阻塞，可将所有Promise对象用
Promise.all([promiseA,promiseB])组合，再awaitlet res = await Promise.all([promiseA,promiseB])2.
JS Event Loop优先级 调用栈（顺序入栈）>微任务（promise、async、await）>消息队列（定时器）3.async异步函数的返回值为
Promise对象，但如果你不return，就没什么意义了4.async、await，让异步代码变得更像同步代码了，可读性提高，由上而下
async await读取文件案例
const fs = require('fs') // 引入模块
function readW() {
return new Promise(function(resolve, reject) {
fs.readFile('./md/为学.md',(err,data) => {
if (data) resolve(data)
reject(err)
})
})
}
function readC() {
return new Promise(function(resolve, reject) {
fs.readFile('./md/插秧诗.md',(err,data) => {
if (data) resolve(data)
reject(err)
})
})
}
function readG() {
return new Promise(function(resolve, reject) {
fs.readFile('./md/观书有感.md',(err,data) => {
if (data) resolve(data)
reject(err)
})
})
}
async function main() {
try { // 捕获异常
let w = await readW()
let c = await readC()
let g = await readG()
console.log(w.toString())
console.log(c.toString())
console.log(g.toString())
} catch (e) {
console.log(e)
}
}
main()async与await封装AJAX请求
// 发送ajax请求，返回结果是Promise对象
function sendAjax(url) {
return new Promise((resolve, reject) => {
const x = new XMLHttpRequest()
x.open("GET", url)
x.send()
x.onreadystatechange = function () {
if (x.readyState === 4) {
if (x.status >= 200 && x.status < 300) {
resolve(x.response) // 响应数据作为Promise对象返回
} else {
reject(x.response)
}
}
}
})
}
async function main() {
let res = await sendAjax("http://poetry.apiopen.top/sentences")
res = JSON.parse(res)
console.log(res.result.name)
}
main()
// Promise then 方法测试
// sendAjax("http://poetry.apiopen.top/sentences").then((res) => {
// let josnRes = JSON.parse(res)
// console.log(josnRes.result.name)
// })values()方法
【ES6】返回一个新的【数组迭代器】对象，该对象包含数组中每个索引的值，可枚举，可用循环遍历该对象
原型方法
Object对象原型上也有该方法，是静态方法，需要通过Object调用
entries()方法
【ES6】返回一个新的【数组迭代器】对象，该对象包含数组中每个索引的键值对，可枚举，可用循环遍历该对象
原型方法
Object对象原型上也有该方法，是静态方法，需要通过Object调用
Object.getOwnPropertyDescriptor()方法
该方法返回指定对象所有自身属性的描述对象
自有属性：指的是直接赋予该对象的属性，不需要从原型链上进行查找的属性
value
该属性的值(仅针对数据属性描述符有效)
writable读
当且仅当属性的值可以被改变时为true(仅针对数据属性描述有效)
get
获取该属性的访问器函数（getter）如果没有访问器，该值为undefined(仅针对包含访问器或设置器的属性描述有效)
set
获取该属性的设置器函数（setter）如果没有设置器，该值为undefined(仅针对包含访问器或设置器的属性描述有效)
configurable删
当且仅当指定对象的属性描述可以被改变或者属性可被删除时，为true
enumerable枚举
当且仅当指定对象的属性可以被枚举出时，为true
padStart()、padEnd()
ES2017引入了字符串补全长度的功能
如果某个字符串不够指定长度，会在头部或尾部补全
padStart()用于头部补全，padEnd()用于尾部补全
可作用于时间戳的补0