js扩展API

数组方法

1. 拆分多维数组flat

let arr = [1,2,[3,4,[5,6]]]
console.log(arr.flat(2))
// [1,2,3,4,5,6]

2. 数组元素修改fill

let arr = [1, 2, 3, 4, 5]
console.log(arr.fill(10, 2))
// [1, 2, 10, 10, 10]

3. 只改变数组其中一个元素with

let arr = [1, 2, 3, 4, 5]
console.log(arr.with(1, 100))
//[1, 100, 3, 4, 5]

数值方法

1. Math.trunc() 方法会将数字的小数部分去掉，只保留整数部分

let a = 123.9999
console.log(Math.trunc(a))
// 123

2. Math.sign() 函数返回一个数字的符号，指示数字是正数，负数还是零

console.log(Math.sign(99))
// 1
console.log(Math.sign(-3))
// -1
console.log(Math.sign(0))
// 0

字符串方法

1. startsWith和endsWith方法可以判断字符串是否以指定字符串开头或结尾

let str = "hello"
console.log(str.startsWith("h"))
// true
console.log(str.startsWith("h", 1))
// false
console.log(str.endsWith("o"))
// true

2. 字符串的repeat方法可以重复字符串

let str = "hello"
console.log(str.repeat(3))
// hellohellohello

3. 字符串的padStart和padEnd方法可以对字符串进行填充

let str = "hello"
console.log(str.padStart(10, "world"))
// worldhello
console.log(str.padEnd(10, "world"))
// helloworld

at函数

用于访问数组

let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
console.log(arr.at(1))
// 2
console.log(arr.at(-1))
// 10

generator函数

生成器函数可以暂停执行，下次调用时继续执行

function *generator() {
            yield 'aaa';
            yield 'bbb';
        }
        let a = generator();
        for(let item of generator()){
            console.log(item);
        }
// aaa
// bbb

Reflect

Reflect对象提供了一组静态方法，用于操作对象的属性和方法

1. Reflect.has判断对象是否存在某个属性

let obj = {
            name: 'xiaoming',
            age: 18
        }
console.log(Reflect.has(obj, 'name'))
// true

2. Reflect.ownKeys()返回这个对象自身的属性

console.log(Reflect.ownKeys(obj))
// [ 'name', 'age' ]

3. Reflect.defineProperty()为对象添加一个属性，并且可以进行配置

Reflect.defineProperty(obj, 'height', {
            value: 170,
            writable: true,
            enumerable: true,
            configurable: true
        })
console.log(obj)
// { name: 'xiaoming', age: 18, height: 170 }

4. Reflect.set()为对象直接添加一个属性

Reflect.set(obj, 'weight', 70)
console.log(obj)
// {name: 'xiaoming', age: 18, weight: 70}

5. Reflect与Proxy联合使用

let obj = {}
let proxy = new Proxy(obj, {
        get(target, key) {
            return Reflect.get(...arguments)
        },
        set(target, key, value) {
            Reflect.set(...arguments)
            return true
        }
    })

matchAll()方法

返回一个迭代器，该迭代器包含了检索字符串与正则表达式进行匹配的所有结果

let str = `
        <ul>
            <li>1111</li>
            <li>2222</li>
            <li>3333</li>
            <li>4444</li>
        </ul>
    `
let reg = /<li>(?<content>.*)<\/li>/g
for(var item of str.matchAll(reg)){
    console.log(item)
}

Promise集合

一个 Promise 必然处于以下几种状态之一： 1.待定（pending）：初始状态，既没有被兑现，也没有被拒绝。 2.已兑现（fulfilled）：意味着操作成功完成。 3.已拒绝（rejected）：意味着操作失败。

function ajax(str, time, isSuccess) {
            if (isSuccess){
                return new Promise((resolve, reject) => {
                setTimeout(() => {
                    resolve(str);
                }, time);
              });
            }else{
                return new Promise((resolve, reject) => {
                setTimeout(() => {
                    reject(str);
                }, time);
              });
            }
        }

1. Promise.all()等待所有 Promise, 在任意一个 Promise 被拒绝时拒绝

Promise.all([ajax('1',1000, true), ajax('2',2000, true)]).then((res) => {
            console.log(res)
        }).catch((err) => {
            console.log(err)
        })

2. Promise.race() 看哪一个 Promise 先被执行完，就执行哪一个 Promise

Promise.race([ajax('1',1000, true), ajax('2',2000, true)]).then((res) => {
            console.log(res)
        }).catch((err) => {
            console.log(err)
        })

3. Promise.any()当输入的任何 promise 实现时，此返回的 promise 将实现，并具有第一个 fulfillation 值。当所有输入的 promise 都拒绝时（包括传递空可迭代对象时），它会拒绝

Promise.any([ajax('1',1000, false), ajax('2',2000, true)]).then((res) => {
             console.log(res)
         }).catch((err) => {
             console.log(err, '拒绝')
        })

4. Promise.allSettled() 无论任何 promise 实现，此返回的 promise 都将实现，并具有一个数组，其中包含每个输入 promise 的状态和值。

Promise.allSettled([ajax('1',1000, false), ajax('2',2000, false)]).then((res) => {
            console.log(res)
        }).catch((err) => {
            console.log(err)
        })