深浅克隆和Promise异步编程

1浅克隆

arr.slice(0) arr.concat() let obj2 = {... obj}
 

2深克隆

function deepClone(obj){ //判断参数是不是一个对象 let objClone = new obj.constructor(); if(obj && typeof obj==="object"){ for(key in obj){ if(obj.hasOwnProperty(key)){ //判断ojb子元素是否为对象,如果是,递归复制 if(obj[key]&&typeof obj[key] ==="object"){ objClone[key] = deepClone(obj[key]); }else{ //如果不是,简单复制 objClone[key] = obj[key]; } } } } return objClone; }
 

Promise详解

局部地狱

回调地狱:上一个回调函数中继续做事情,而且继续回调(在真实项目的AJAX请求中经常出现回调地狱)=>异步请求、不方便代码的维护

Promise的诞生就是为了解决异步请求中的回调地狱问题:它是一种设计模式,ES6中提供了一个js内置类Promise,来实现这种设计模式

function ajax1() { return new Promise(resolve => { $.ajax({ url: '/student', method: 'get', data: { class: 1 }, success: resolve }); }); } function ajax2(arr) { return new Promise(resolve => { $.ajax({ url: '/score', method: 'get', data: { stuId: arr }, success: resolve }); }); } function ajax3() { return new Promise(resolve => { $.ajax({ url: '/jige', // ... success: resolve }); }); } ajax1().then(result => { return ajax2(result.map(item => item.id)); }).then(result => { return ajax3(); }).then(result => { });

PROMISE是用来管理异步编程的,它本身不是异步的:new
Promise的时候会立即把executor函数执行(只不过我们一般会在executor函数中处理一个异步操作)

PROMISE本身有三个状态 =>[[PromiseStatus]]

pending 初始状态

fulfilled 代表操作成功(resolved)

rejected 代表当前操作失败

 

new Promise的时候先执行executor函数,在这里开启了一个异步操作的任务(此时不等:把其放入到EventQuque任务队列中),继续执行

p1.then基于THEN方法,存储起来两个函数(此时这两个函数还没有执行);当executor函数中的异步操作结束了,基于resolve/reject控制Promise状态,从而决定执行then存储的函数中的某一个

let p1 = new Promise((resolve, reject) => { setTimeout(_ => { let ran = Math.random(); console.log(ran); if (ran < 0.5) { reject('NO!'); return; } resolve('OK!'); }, 1000); });

THEN:设置成功或者失败后处理的方法
THEN方法结束都会返回一个新的Promise实例(THEN链)

p1.then(result => { console.log(`成功:` + result); }, reason => { console.log(`失败:` + reason); });

p2/p3这种每一次执行then返回的新实例的状态,由then中存储的方法执行的结果来决定最后的状态(上一个THEN中某个方法执行的结果,决定下一个then中哪一个方法会被执行)

=>不论是成功的方法执行,还是失败的方法执行(THEN中的两个方法),凡是执行抛出了异常,则都会把实例的状态改为失败

=>方法中如果返回一个新的PROMISE实例,返回这个实例的结果是成功还是失败,也决定了当前实例是成功还是失败

=>剩下的情况基本上都是让实例变为成功的状态 (方法返回的结果是当前实例的value值:上一个then中方法返回的结果会传递到下一个then的方法中)

let p1 = new Promise((resolve, reject) => { resolve(100); }); let p2 = p1.then(result => { console.log('成功:' + result); return result + 100; }, reason => { console.log('失败:' + reason); return reason - 100; }); let p3 = p2.then(result => { console.log('成功:' + result); }, reason => { console.log('失败:' + reason); });

 

TEHN中也可以只写一个或者不写函数

.then(fn)

.then(null,fn)

 

遇到一个THEN,要执行成功或者失败的方法,如果此方法并没有在当前THEN中被定义,则顺延到下一个对应的函数

Promise.all(arr):返回的结果是一个PROMISE实例(ALL实例),要求ARR数组中的每一项都是一个新的PROMIE实例,

PROMISE.ALL是等待所有数组中的实例状态都为成功才会让“ALL实例”状态为成功,VALUE是一个集合,存储着ARR中每一个实例返回的结果;凡是ARR中有一个实例状态为失败,“ALL实例”的状态也是失败

Promise.race(arr):和ALL不同的地方,RACE是赛跑,也就是ARR中不管哪一个先处理完,处理完的结果作为“RACE实例”的结果

 

async / await

 

AWAIT会等待当前PROMISE的返回结果,只有返回的状态是RESOLVED情况,才会把返回结果赋值给RESULT

 

电脑刺绣绣花厂 http://www.szhdn.com 广州品牌设计公司https://www.houdianzi.com

AWAIT不是同步编程,是异步编程(微任务):当代码执行到此行(先把此行),构建一个异步的微任务(等待PROMISE返回结果,并且AWAIT下面的代码也都被列到任务队列中),

async function fn() { console.log(1); let result = await p2; console.log(result); let AA = await p1; console.log(AA); } fn(); console.log(2); */

如果PROMISE是失败状态,则AWAIT不会接收其返回结果,AWAIT下面的代码也不会在继续执行(AWAIT只能处理PROMISE为成功状态的时候)

async function fn() { let reason = await p3; console.log(reason); } fn(); */
posted @ 2020-10-15 16:50  笑人  阅读(120)  评论(0编辑  收藏  举报