js基础篇4

proxy

 let obj = {
     name: 'tom',
 }
    
 // 使用 proxy 监听 obj 的变化
 proxy = new Proxy(obj, {
     get(target, key) {
         console.log(`get ${key}`)
         if (key === 'name') {
             a.innerHTML = target[key]
         }
         return target[key]
     },
     set(target, key, value) {
         console.log(`set ${key} = ${value}`)
         if (key === 'name') {
             a.innerHTML = value
         }
         target[key] = value
         return true
     }
 })
proxy.name
// get name

Reflect配合proxy

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

promise相关api

一个 Promise 必然处于以下几种状态之一：

​ 1.待定（pending）：初始状态，既没有被兑现，也没有被拒绝。

​ 2.已兑现（fulfilled）：意味着操作成功完成。

​ 3.已拒绝（rejected）：意味着操作失败。

ajax函数

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);
        });
    }
}

Promise.all()

等待所有 Promise, 在任意一个 Promise 被拒绝时拒绝

 Promise.all([ajax('1',1000, true), ajax('2',2000, true)]).then((res) => {
     console.log(res)
 }).catch((err) => {
     console.log(err)
 })
// ['1', '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)
})
// 1

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, '拒绝')
})
// 2

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)
})
/*
[{…}, {…}]
0: {status: 'rejected', reason: '1'}
1: {status: 'rejected', reason: '2'}
*/