Promise的原理和作用域的用法和实例

371 阅读3分钟

Promise

先说下Promise原理

Promise是一种异步编程的解决方案,它可以让我们更方便地处理异步操作,避免了回调地狱的问题。Promise的核心思想是将异步操作封装成一个对象,通过链式调用的方式来处理异步操作的结果。

Promise状态

状态有三种分别是 pending(进行中) fulfilled(已成功) rejected(已失败)

pending:初始状态,既不代表成功也不代表失败,无论是失败还是成功都会执行

     let b=0
        function getCount(){
            return new Promise((resolve, reject) =>{
                setTimeout(()=>{
                    b=300
                    resolve(b)  // resolve返回成功的状态
                },1000)
            })
        }
        console.log(getCount());  // fulfilled  300
    let a=0
        function getNumber(){
            return new Promise((resolve, reject) =>{
                setTimeout(()=>{
                    a=30
                    reject(a)  // reject返回失败的状态
                })
            })
        }

        console.log(getNumber());  // rejected  30

Promise方法

静态方法:promise.resolve() promise.reject()

  1. Promise.resolve()函数被执行时, 会将promise的状态从 pending 改成fulfilled成功

  2. Promise.reject()函数被执行时, 会将promise的状态从pending 改成rejected失败

    new Promise((resolve, reject) =>{
    
        resolve() // Promise.resolve--->fulfilled 成功
        
        reject() // Promise.reject--->rejected  失败
        
    })
  1. Promise.all()函数执行时,返回所有的promise
   // 根据上面写的代码继续往下写的
   Promise.all([getCount(),getNumber()]).then(res=>{
        console.log(res); // [300,30] 都成功之后才会打印
    }).catch(err=>{
        console.log(err); // 300 返回失败的那个Promise
    })
  1. Promise.race()函数执行时,返回执行最快的Promise
   Promise.race([getCount(),getNumber()]).then(res=>{
        console.log(res); // 300 状态都为成功返回最快的那个
   }).catch(err=>{
        console.log(err); // 30 状态都为失败返回最快的那个
   })

作用域

作用域分为全局作用域,函数作用域(局部作用域) 自动全局作用域

全局作用域

1直接写在 script 标签中的 JavaScript 代码都是全局作用域。当页面打开运行时全局作用域就会自动创建,而当页面关闭时就会销毁。在全局作用域中有一个全局的 window 对象可以使用,而所有全局作用域对象都会作为 window 对象的属性来使用。

    console.log(window);
    var a = 10;
    console.log(window.a); // 10

    function aa() {
        console.log('aa') // aa
    }
    window.aa();

    var aaa = {
        name: '张三'
    }
    console.log(window.aaa.name);  // 张三

函数作用域

作用于函数内的代码环境,就是局部作用域。由于跟函数有关,所以也称为函数作用域。 局部作用域(函数作用域)是在调用函数时才会被创建,函数执行完毕后就自动销毁。同时,每 调用一次函数就会创建一个新的函数作用域,它们之间是相互独立的。 在函数作用域中可以访问全局作用域,而在全局作用域中不能访问函数作用域。当在函数作用域 中使用一个变量时,它会先在自身作用域内查找,如果找到就直接使用,如果没有找到则会向上 一级作用域查找,直到找到全局作用域为止。如果都没有找到则会报错。

   var age = 18;

    function fn() {
        var age = 20;
        console.log(age); // 20
        console.log(this.age); // 18
        //console.log(this);
        console.log(window.age); // 18
    }
    window.fn();

自动全局作用域

如果没有声名变量赋值,这变量会自动成为全局变量

   function fn() {
        age = 19;
        console.log(age);  // 19
    }
    fn();
    console.log(window); // window
    console.log(age); // 19