es6 Promise,生成器函数,async

生成器函数

简单使用:

 // 生成器就是一个特殊的函数// 异步编程 纯回调函数 node gs ajax mongodbfunction* gen() {// console.log(111);yield '一只没有耳朵';// console.log(222);yield '一只没有尾巴';// console.log(333);yield '真奇怪';// console.log(444);}let iterator = gen()console.log(iterator.next())console.log(iterator.next())console.log(iterator.next())console.log(iterator.next())// 遍历for (let v of gen()) {console.log(v)}

生成器函数参数

 function* gen(arg) {console.log(arg)let one = yield 111;console.log(one)let two = yield 222;console.log(two)let three = yield 333;console.log(three)}// 执行获取迭代器对象let iterator = gen('AAA');console.log(iterator.next())console.log(iterator.next('BBB'))console.log(iterator.next('CCC'))console.log(iterator.next('DDD'))// next 方法可以传入形参

生成器函数实例

 //  1s 控制台输出111, 2s输出222, 3s 输出333// 回调地狱// setTimeout(() => {//   console.log(111)//   setTimeout(() => {//     console.log(222)//     setTimeout(() => {//       console.log(333)//     },3000)//   }, 2000)// }, 1000)function one() {setTimeout(() => {console.log(111)iterator.next()}, 1000)}function two() {setTimeout(() => {console.log(222)iterator.next()}, 1000)}function three() {setTimeout(() => {console.log(333)}, 1000)}function* gen() {yield one();yield two();yield three();}// 调用生成器函数let iterator = gen()iterator.next()

生成器函数实例2:

// 模拟获取 用户数据 订单数据 商品数据function getUsers() {setTimeout(() => {let data = '用户数据'// 调用next 方法 ,并且data传入iterator.next(data)}, 1000)}function getOrders() {setTimeout(() => {let data = '订单数据'iterator.next(data)}, 1000)}function getGoods() {setTimeout(() => {let data = '商品数据'iterator.next(data)}, 1000)}// 声明生成器函数function* gen() {let users = yield getUsers();console.log(users)let orders = yield getOrders();console.log(orders)let goods = yield getGoods();console.log(goods)}// 调用生成器函数let iterator = gen();iterator.next()

 

 

Promise的使用

Promise的基本认识

promise有三种状态:pending/reslove/reject 。pending就是未决,resolve可以理解为成功,reject可以理解为拒绝。

// Promise 是ES6引入的异步编程的新解决方案,语法上promise是一个构造函数,用来封装异步操作并可以获取其成功或失败的结果// 1 Promise 构造函数: Promise(excutor){}// 2 Promise.prototype.then 方法// 3 Promise.prototype.catch 方法// 实例化Promise对象const p = new Promise(function (resolve, reject) {setTimeout(function () {// 调用成功的函数let data = '数据库中的用户数据'resolve(data)// 调用失败的函数// let err = '数据读取失败'// reject(err)}, 1000)})// 调用 promise 对象的 then 方法p.then(function (v) {console.log(v)}, function (v) {console.log(v)})

Promise的then方法

    // 创建Promise对象const p = new Promise(function (resolve, reject) {setTimeout(() => {resolve('用户数据')}, 1000)})//调用then方法  then方法的返回结果是Promise,对象的状态由回调函数的执行结果决定// 1.如果回调函数中的返回结果是非Promise类型的属性,状态为成功,返回值为对象的成功值const result = p.then(function (v) {console.log(v)// 1 非promise 类型的属性// return 123// 2 是Promise 对象// return new Promise(function (resolve, reject) {// resolve('OK')//   reject('error')// })// 3 抛出错误throw new Error('出错啦')}, function (reason) {console.warn(reason)})console.log(result)// 链式调用P.then(v => { }).then(v => { })

promise的catch方法

    const p = new Promise(function (resolve, reject) {setTimeout(() => {// 设置p对象的状态为失败,并设置失败的值reject('出错啦!')}, 1000)})// catch相当于 语法糖(因为只用then一样可以实现)p.catch(function (reason) {console.log(reason)})

promise封装ajax

    const p = new Promise(function (resolve, reject) {// 1,创建对象const xhr = new XMLHttpRequest();// 2 初始化xhr.open('get', 'https://api.apiopen.top/getJoke');// 3 发送xhr.send();// 4 绑定事件,处理相应结果xhr.onreadystatechange = function () {// 判断if (xhr.readState === 4) {// 判断响应码if (xhr.status >= 200 && xhr.status < 300) {// 表示成功resolve(xhr.response)} else {// 如果失败reject(xhr.status)}}}})p.then(function (v) {console.log(v)}, function (reason) {console.log(reason)})

promis 读取多个文件

    const p = new Promise(function (resolve, reject) {fs.readFile('./锄禾.md', (err, data) => {resolve(data)})})p.then(value => {return new Promise((resolve, reject) => {fs.readFile('./插秧.md', (err, data) => {resolve([value, data])})})}).then(value => {return new Promise((resolve, reject) => {fs.readFile('./观书有感.md', (err, data) => {// 压入resolve(value.push(data))})})}).then(value => {ocnsole.log(value.join('\r\n'))})

promise.all&&promise.allSettled

    // 声明两个promise对象const p1 = new Promise((resolve, reject) => {setTimeout(() => {resolve('数据1')}, 1000)})const p2 = new Promise((resolve, reject) => {setTimeout(() => {resolve('shibai')}, 1000)})//调用allsettled 方法 ,即使有一个失败也会返回成功// const result = Promise.allSettled([p1, p2]);// console.log(result)// all 只要有一个失败就返回失败的回调,如果全部成功,则返回一个只有数据的数组const res = Promise.all([p1, p2]);console.log(res)

 

 

async和await

async 函数返回一个 Promise 对象,可以使用 then 方法添加回调函数。

    async function eg() {return '我是一个字符串'}console.log(eg()) // Promise {<fulfilled>: "我是一个字符串"}eg().then(v => {console.log(v);         // 我是一个字符串})

 

 await

    正常情况下,await 命令后面是一个 Promise 对象,它也可以跟其他值,如字符串,布尔值,数值以及普通函数。

    async 函数中可能会有 await 表达式,async 函数执行时,如果遇到 await 就会先暂停执行 ,等到触发的异步操作完成后,恢复 async 函数的执行并返回解析值。
    await 关键字仅在 async function 中有效。如果在 async function 函数体外使用 await ,你只会得到一个语法错误。

    await针对所跟不同表达式的处理方式:

  •      Promise 对象:await 会暂停执行,等待 Promise 对象 resolve,然后恢复 async 函数的执行并返回解析值。
  •      非 Promise 对象:直接返回对应的值。
   function time() {return new Promise((resolve, reject) => {setTimeout(() => { console.log('我是延迟两秒后出现的内容'); resolve() }, 2000)})}async function eg2() {await time()console.log('我是一段正常的内容')}eg2()//我是延迟两秒后出现的内容//我是一段正常的内容

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/511212.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Linux 中的管道是什么?管道重定向是如何工作的?

作者 | 刘光录来源 | TIAP我们在命令行中经常会用到类似 cmd0 | cmd1 | cmd2 的写法。其实&#xff0c;这是管道重定向&#xff08;pipe redirection&#xff09;&#xff0c;用于将一个命令的输出作为输入重定向到下一个命令。那么&#xff0c;你知道它具体是怎么工作的吗&…

AliRTC 开启视频互动 “零计算” 时代

简介&#xff1a;在 2021 云栖大会《产业视频化创新与最佳实践》视频云主题论坛中&#xff0c;阿里云智能高级技术专家在《AliRTC 开启视频互动 "零处理" 时代》的主题演讲中&#xff0c;发布了阿里云视频云下一代实时交互解决方案 —RTC “零处理”&#xff0c;同时…

es6 map与set

set 定义: Set 对象允许你存储任何类型的唯一值&#xff0c;无论是原始值或者是对象引用&#xff0c;Set对象是值的集合&#xff0c;你可以按照插入的顺序迭代它的元素。Set中的元素只会出现一次&#xff0c;即 Set 中的元素是唯一的 Set本身是一个构造函数&#xff0c;用来生…

网易数帆Curve加入PolarDB开源数据库社区

简介&#xff1a;Curve社区签署阿里巴巴开源CLA(Contribution License Agreement, 贡献许可协议), 正式与阿里云PolarDB 开源数据库社区牵手。 Curve社区签署阿里巴巴开源CLA(Contribution License Agreement, 贡献许可协议), 正式与阿里云PolarDB 开源数据库社区牵手。 Polar…

新起之秀 DPU,正在掀起数据中心变革!

在全产业数字化转型趋势之下&#xff0c;网络数据呈海量增长态势&#xff0c;传统 CPU 解决方案已无法负载现有的业务量——数据处理的效能受到限制&#xff1b;上层的应用计算能力受到限制。此时&#xff0c;DPU 逢时而生&#xff0c;DPU能够通过对网络、储存、算力等资源的有…

阿里云数据库开源发布:PolarDB三节点高可用的功能特性和关键技术

简介&#xff1a;在3月2日的阿里云开源 PolarDB 企业级架构发布会上&#xff0c;阿里云数据库技术专家孟勃荣 带来了主题为《PolarDB 三节点高可用》的精彩演讲。三节点高可用功能主要为 PolarDB 提供金融级强一致性、高可靠性的跨机房复制能力&#xff0c;基于分布式共识算法同…

对象的基础用法和解构赋值

属性简写 let a 1; let obj { a } console.log(obj) //{a:1} 可计算的属性值 let count 0function addcount(key) {return ${key}_${count}}const nameKey name;const agekey "age";const jobKey "job";let person {[addcount(nameKey)]: Matt,[a…

全员学习低代码,一汽大众领跑数智化转型背后的秘密

简介&#xff1a;500位低代码开发者&#xff0c;90%来自一线&#xff0c;低代码开发在一汽-大众百花齐放。 一汽-大众有500位低代码开发者&#xff0c;90%是来自一线的业务人员&#xff0c;他们如何用低代码解决身边的数字化需求&#xff1f;钉钉宜搭《102个开发者故事》走进一…

智领云CEO彭锋:DataOps,大数据的新战线

作者 | 彭锋 供稿 | 智领云 2008年我在我的第一份工作&#xff08;Ask.com&#xff09;中开始使用Hadoop。当时是因为昂贵的Oracle集群无法处理不断增加的分析工作量&#xff0c;公司不得不切换到Hadoop。随后在Twitter担任数据工程师的第二份工作中&#xff0c;我在第一线参…

宜搭小技巧|维护Excel太麻烦?Excel一键转应用,为你的工作减负

简介&#xff1a;只需6步&#xff0c;轻松学会「Excel一键创建应用」&#xff01; 在钉钉的聊天窗口中&#xff0c;每天都会流转数量巨大的Excel表格&#xff0c;用于信息收集和数据统计&#xff0c;但有时这些表格并不能很好地帮助到我们的工作&#xff0c;相反还会带来许多不…

阿里云发布第四代神龙架构,提供业界首个大规模弹性RDMA加速能力

简介&#xff1a;10月20日&#xff0c;2021年杭州云栖大会上&#xff0c;阿里云发布第四代神龙架构&#xff0c;升级至全新的eRMDA网络架构&#xff0c;是业界首个大规模弹性RDMA加速能力。 10月20日&#xff0c;2021年杭州云栖大会上&#xff0c;阿里云发布第四代神龙架构。相…

性能提升40%,阿里云神龙大数据加速引擎获TPCx-BB世界排名第一

简介&#xff1a;神龙大数据加速引擎&#xff0c;针对大数据常用组件&#xff0c;如Spark、Hadoop、Alluxio等,结合阿里云神龙架构的特性&#xff0c;进行软硬一体化优化&#xff0c;形成独一无二的性能优势&#xff0c;最终&#xff0c;使复杂SQL查询场景性能相比社区版spark提…

构造函数的原型和原型链

转载 https://blog.csdn.net/weixin_44976833/article/details/101322081 构造函数和原型和原型链 1.静态成员和实例成员 1.1静态成员 静态成员在构造函数本身上添加的成员,静态成员只能通过构造函数来访问 function Person(name,age){this.name name;this.age age; } /…

redis + lua实现分布式接口限流实现方案

作者 | 步尔斯特来源 | 步尔斯特前言redis lua脚本已然成为了单体项目主流的限流方案。redis凭借其特性成为了中间件的佼佼者&#xff0c;最新官方测试数据&#xff1a;读的速度是110000次/s写的速度是81000次/s。lua&#xff1a;减少网络开销&#xff1a;使用Lua脚本&#xf…

微服务用户为什么要用云原生网关

简介&#xff1a;下文将为你解说云原生网关如何助你解决一系列痛点&#xff0c;优雅玩转云上微服务架构升级。 作者&#xff1a;百丈 随着云原生技术的发展&#xff0c;微服务的架构选型也是日新月异。在 Kubernetes 重塑运维体系的云时代&#xff0c;我们在安全、降本提效、…

15 分钟实现企业级应用无损上下线

简介&#xff1a;很多用户量大并发度高的应用系统为了避免发布过程中的流量有损&#xff0c;一般选择在流量较小的半夜发布&#xff0c;虽然这样做有效果&#xff0c;但不可控导致背后的研发运维成本对企业来说是一笔不小的负担。基于此&#xff0c;阿里云微服务引擎 MSE 在应用…

class 类

【基础认知】 1、构造器中的this指向——类的实例对象 2、类中的构造器不是必须写的&#xff0c;要对实例进行一些初始化的操作&#xff0c;如添加指定属性时才写。 3、如果A类继承了B类&#xff0c;且A类中写了构造器&#xff0c;那么A类构造器中的super时必须要调用的。 4、类…

Azure语音合成再添新声音,“风格迁移”技术为不同音色实现多情感演绎

微软Azure Neural TTS&#xff08;神经网络版文本转语音&#xff09;新增五种声音模型&#xff0c;让我们再次体会到了“风格迁移”技术对AI语音模型多情感多风格的强大支持。 此次更新的五个美式英语声音模型&#xff0c;包括青春甜美的Jane、低沉温和的Nancy、随性且精力充沛…

基于 Observable 构建前端防腐策略

简介&#xff1a;To B 业务的生命周期与迭代通常会持续多年&#xff0c;随着产品的迭代与演进&#xff0c;以接口调用为核心的前后端关系会变得非常复杂。在多年迭代后&#xff0c;接口的任何一处修改都可能给产品带来难以预计的问题。在这种情况下&#xff0c;构建更稳健的前端…

动态卡片:富媒体内容井喷式增长下,新一代移动端动态研发的模式

简介&#xff1a;「蚂蚁动态卡片」新品发布会全程回顾 在 iOS 和 Android 系统近期推送的更迭版本中&#xff0c;系统环境已经逐渐发展出了将部分内容和服务前置化展示的趋势。 同时&#xff0c;伴随着富媒体内容井喷式增长以及内容的多样化、年轻化&#xff0c;一款移动应用…