笔记4.08

78 阅读4分钟

同步和异步

同步代码依次执行

异步代码会滞后执行

js是单线程的

所谓单线程,就是指在JS引擎中负责解释和执行JavaScript代码的线程只有一个,一次只能完成一件任务。如果有多个任务,就必须排队,前面一个任务完成,再执行后面一个任务。如果一个任务耗时过长,那么后面的任务就必须一直等待下去,会拖延整个程序。

"同步模式"就是后一个任务等待前一个任务结束,然后再执行,程序的执行顺序与任务的排列顺序是一致的、同步的。

如在函数A返回的时候,调用者就能够得到预期结果(即拿到了预期的返回值或者看到了预期的效果),那么这个函数就是同步的。

"异步模式"则完全不同,每一个任务有一个或多个回调函数(callback),前一个任务结束后,不是执行后一个任务,而是执行回调函数,后一个任务则是不等前一个任务结束就执行,所以程序的执行顺序与任务的排列顺序是不一致的、异步的。

如在函数A返回的时候,调用者还不能够得到预期结果,而是需要在将来通过一定的手段得到,那么这个函数就是异步的。

其实同步和异步,无论如何,做事情的时候都是只有一条流水线(单线程),同步和异步的差别就在于这条流水线上各个流程的执行顺序不同。 JS异步问题是指同步任务依赖异步资源的问题。由于JS的单线程事件循环机制,同步任务总是在异步任务之前执行,而有些同步任务又需要等待异步任务的结果,这就产生了冲突。JS提供了一些异步编程的解决方案,如Promise,它可以将异步操作封装成一个对象,然后用then和catch方法来处理异步操作的结果和异常

Promise Promise 构造函数是 JavaScript 中用于创建 Promise 对象的内置构造函数。

Promise 构造函数接受一个函数作为参数,该函数是同步的并且会被立即执行,所以我们称之为起始函数。起始函数包含两个参数 resolve 和 reject,分别表示 Promise 成功和失败的状态。

起始函数执行成功时,它应该调用 resolve 函数并传递成功的结果。当起始函数执行失败时,它应该调用 reject 函数并传递失败的原因。

Promise 构造函数返回一个 Promise 对象,该对象具有以下几个方法:

  • then:用于处理 Promise 成功状态的回调函数。
  • catch:用于处理 Promise 失败状态的回调函数。
  • finally:无论 Promise 是成功还是失败,都会执行的回调函数。

promise 的三种状态 1.pending (等待) 状态 传入回调默认状态就是 pending状态

例:
    let p1 = new Promise((resolve,rejiect)=>{

    });

2.fulfilled状态 : 成功状态 ,当调用 resolve的时候

例:
    let p1 = new Promise((resolve, reject)=>{
        reject(11111);
    });
    console.log(p1);
  1. rejected 失败状态 ,当调用reject的时候
例:
    let p1 = new Promise((resolve, reject)=>{
        reject("错误");
    });
    console.log(p1);

    let p1 = new Promise((resolve,reject)=>{
        setTimeout(()=>{
            resolve("成功");
        },1000);
    })
    console.log(p1);

then的2种回调 then的2中回调

每一个promise对象会自带then方法,then 可以接收2种回调函数onResolved和onRejected函数;

例 :
    let p1 = new Promise((resolve,reject)=>{
        setTimeout(() => {
            // resolve("hello")
            reject("错误")
        }, 1000);
    })

第一个回调函数 当调用 resolve 函数的时候会执行then的 第一个回调。 且会把 promiseReslut的值传递给这个回调参数。

例 :
    p1.then(res=>{
        console.log("这是第一个回调",res)
    },err=>{
        console.log("这个是第二个回调 会在调用reject的时候执行",err)
    })

then的四种返还值

例:
    let p = new Promise((resolve, reject) => {
        resolve(1111)
        // reject("失败嘞!!!")
    })
    let res = p.then(res => {
        // return new Promise((resolve)=>{resolve("我是返还promise结果值")});
        throw new Error("抛出错误");
        // return "hello"
    },err=>{
        // console.log(err);
        // return "hello"
        // return new Promise(resolve=>{resolve("222")})
        // throw new Error("抛出错误");

    })

    res.then(res=>{
        console.log("??",res);
    },err=>{
        console.log("---",err)
    })

    console.log(res);
一、在resolve回调函数里返还

1.then函数里没有任何返还 ;
    会返还 状态 fulfilled 状态  结果值 undefined

2.返还普通值 
   会返还 状态 fulfilled 状态  结果值 是返还的值

3.返还一个promise对象
    会把原本的promise对象返还

4.then里抛出错误
    会返还 状态 rejected 状态  结果值 是错误值

二、在reject函数里返还 结果和上述一致;     

无限链式操作 实现

例:
    class MyPromise{
        constructor(){

        }
        then(){
            console.log("then");
            // return new MyPromise();
            return this;
        }
    }

    let p2 = new MyPromise();
    p2.then().then().then().then()