1. 数组方法扩展

• Array.prototype.includes()
• 语法 : Array.prototype.includes( search[, fromIndex] )
• 返回值 : 布尔值
• 基础应用 : 判断数组是否包含指定内容

const arr = [ 'es6', 'es7', 'es8', 'es9' ]
const r1 = arr.includes( 'es8' )
console.log(r1) // => true
const r2 = arr.includes( 'es5' )
console.log(r2) // => false

• 通过第二个参数确定查询起始索引位置

const arr = [ 'es6', 'es7', 'es8', 'es9' ]
const r1 = arr.includes( 'es8', 1 )
console.log(r1) // => 表示从索引 1 位置开始检索, 结果为 true
const r2 = arr.includes( 'es8', 3 )
console.log(r2) // => 表示从索引 3 位置开始检索, 结果为 false

• 第二个参数也可以填写负整数, 表示倒数第几个开始检索

const arr = [ 'es6', 'es7', 'es8', 'es9' ]
const r1 = arr.includes( 'es8', -1 )
console.log(r1) // => 表示从索引 3 位置开始检索, 结果为 false
const r2 = arr.includes( 'es8', -3 )
console.log(r2) // => 表示从索引 1 位置开始检索, 结果为 true

• includes 方法可以检测到 NaN

const arr = [ 'es6', 'es7', 'es8', NaN, 'es9' ]
const r1 = arr.includes( NaN )
console.log(r1) // => true

2. 运算符扩展 : 幂运算符

• ** 符号
• 是一个取幂的符号, 等价于 Math.pow() 方法

const r1 = 2 ** 10
// 等价于 Math.pow(2, 10)
console.log(r1) // => 1024

3. 异步解决方案的语法糖 async / await

• 两个关键字 async 和 await
• 用于对 Promise 的优化书写方案

• async

  • 书写在函数前面
  • 为了在该函数内可以使用 await 关键字

• await

  • 需要书写在一个有 async 关键字的函数内
  • 用于等待 Promise 的结果
  • 可以捕获到 Promise 成功的状态

function ajax() {
    return Promsie(() => { /* ... */ })
}

async function fn() {
    const res = await ajax()
    console.log(res)
}

fn()
// 当 fn 调用的时候, 因为 ajax 方法内封装返回的是一个 Promise 对象
// 因为使用了 async / await 关键字
// 所以会在这一段异步代码结束后, 把 success 的结果给到 res 以后, 再继续向后执行代码

4. 对象扩展 : Object.values()

• 用于获取到对象内的每一个 值
• 返回值 : 是一个数组, 包含对象内每一个值

const obj = {
    name: '张三',
    age: 8,
    desc: '法外狂徒'
}
const res = Object.values(obj)
console.log(res) // => [ '张三', 8, '法外狂徒' ]

5. 对象扩展：Object.keys()

• 用于获取到对象内的每一个 键
• 返回值：是一个数组，包含对象内每一个键

const obj = {
    name: '张三',
    age: 8,
    desc: '法外狂徒'
};
const res = Object.keys(obj);
console.log(res); // => ['name', 'age', 'desc']

6. 对象扩展 : Object.entries()

• 用于将给定对象的可枚举属性转化为一个包含键值对的数组
• 返回值 : 是一个二维数组, 和 for ... in 遍历出来的顺序是一样的

const obj = {
    name: '张三',
    age: 8,
    desc: '法外狂徒'
}
const res = Object.entries(obj)
cosnole.log(res)
/*
    [ 
        [ 'name', '张三' ], 
        [ 'age', 8 ], 
        [ 'desc', '法外狂徒' ] 
    ]
*/

7. 对象扩展 : Object.fromEntries()

• 利用给定的键值对构建一个对象数据结构

const entries = new Map([
    [ 'name', '张三' ],
    [ 'age', 8 ],
    [ 'desc', '法外狂徒' ]
])

const res = Object.fromEntries(entries)
console.log(res)
/*
    {
        name: '张三',
        age: 8,
        desc: '法外狂徒'
    }
*/

8. 异步扩展 : for await of

• 用于遍历异步的 Iterator 接口

// 封装一个异步函数
function ajax() { /* ... */ }

async function fn() {
    const arr = [ ajax(), ajax(), ajax() ]
    for await ( let item of arr ) {
        console.log(Date.now(), item)
    }
}

fn()

9. 对象的扩展运算符 : ...

• 可以用于从一个对象内取值, 相当于将目标对象内的所有可遍历但是尚未被获取的属性, 分配到一个新的对象上, 一般用于解构赋值

const obj = {
    name: '张三',
    age: 8,
    desc: '法外狂徒',
    score: 100
}

const { name, age, ...info } = obj

/*
    name         '张三'
    age          8
    info         { desc: '法外狂徒', score: 100 }
*/