同步和异步
同步代码依次执行
异步代码会滞后执行
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);
- 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()