【前端之promise】的更多相关文章

前端 | JS Promise：axios 请求结果后面的 .then() 是什么意思？

Promise 是JS中一种处理异步操作的机制,在现在的前端代码中使用频率很高.Promise 这个词可能有点眼生,但你肯定见过 axios.get(...).then(res => {...}):用于异步请求的 axios 返回的就是一个 Promise 对象. 平时一直在代码中 .then() .catch() 地写来写去,终于决定要认真学一学这个 Promise 到底是怎么回事,希望这篇学习笔记也能帮到你. Promise 对象 一个 Promise 对象表示一个异步操作的执行结果,包括状…

前端之promise

Promise是一个非常重要的方法,它可以是一些异步操作最后归为有序的进行. url: from django.contrib import admin from django.urls import path from app01 import views urlpatterns = [ path('admin/', admin.site.urls), path("index/",views.index), path("index2/",views.index2)…

前端 | JS 任务和微任务：promise 的回调和 setTimeout 的回调到底谁先执行？

首先提一个小问题:运行下面这段 JS 代码后控制台的输出是什么? console.log("script start"); setTimeout(function () { console.log("setTimeout1"); }, 0); new Promise((resolve, reject) => { setTimeout(function () { console.log("setTimeout2"); resolve(); }…

腾讯IVWEB团队：前端 fetch 通信

欢迎大家关注腾讯云技术社区-博客园官方主页,我们将持续在博客园为大家推荐技术精品文章哦~ 作者:villainthr 文章摘自: 前端小吉米 随着前端异步的发展, XHR 这种耦合方式的书写不利于前端异步的 Promise 回调. 而且,写起来也是很复杂. fetch API 本来是在 SW(ServiceWorkers) 中提出的, 不过, 后面觉得好用, 就把他挂载到 window 对象下. 这样, 在前端的正常通信中, 我们也可以直接调用. 但, fetch 毕竟比较新, 看一下他的兼容性…

前端 fetch 通信

随着前端异步的发展, XHR 这种耦合方式的书写不利于前端异步的 Promise 回调. 而且,写起来也是很复杂. fetch API 本来是在 SW(ServiceWorkers) 中提出的, 不过, 后面觉得好用, 就把他挂载到 window 对象下. 这样, 在前端的正常通信中, 我们也可以直接调用. 但, fetch 毕竟比较新, 看一下他的兼容性. 在 PC 端上, 就 FF, Opera 和 Chrome 比较 fashion. mobile 的话, 基本上是不能用的. 当然, 前端…

前端设计技巧——用 Promise 处理交互和异步

本文仅表达前端的一些设计技巧,如果您在查阅js技术,请忽略此文! 前端开发经常会遇到这样的场景: 当满足一定条件时,需要弹出一个模态框,以便接收用户的输入.然后根据不同的输入,进行不用的操作. (ps:这类场景太常见了) 看了很多人的js代码,我发现大多数人的设计是这样的: modalModule{ --//其他代码. cancel(){ closeModal(); } ok(){ handle(inputResult); closeModal(); } } parentModule{ if(c…

前端综合学习笔记---异步、ES6/7、Module、Promise同步 vs 异步

同步 vs 异步 先看下面的 demo,根据程序阅读起来表达的意思,应该是先打印100,1秒钟之后打印200,最后打印300.但是实际运行根本不是那么回事 console.log(100) setTimeout(function () { console.log(200) }, 1000) console.log(300) 再对比以下程序.先打印100,再弹出200(等待用户确认),最后打印300.这个运行效果就符合预期要求. console.log(100) alert(200) // 1秒钟…

前端笔记之ES678&Webpack&Babel（下）AMD|CMD规范&模块&webpack&Promise对象&Generator函数

一.AMD和CMD规范(了解) 1.1传统的前端开发多个js文件的关系 yuan.js中定义了一个函数 function mianji(r){ return 3.14 * r * r } main.js文件中调用这个函数: alert(mianji(10)) 在页面上按顺序引入这两个js文件: <html> <head> <title>Document</title> </head> <body> </body> <…

重学前端 --- Promise里的代码为什么比setTimeout先执行？

首先通过一段代码进入讨论的主题 var r = new Promise(function(resolve, reject){ console.log("a"); resolve() }); setTimeout(()=>console.log("d"), 0) r.then(() => console.log("c")); console.log("b") // a b c d 了解过 Promise 对象的都知道…

前端异步技术之Promise

前言 从事前端的朋友或多或少的接触过Promise,当代码中回调函数层级过多你就会发现Promise异步编程的魅力,相信此文一定能帮你排忧解惑! Promise概念 Promise是JS异步编程中的重要概念,异步抽象处理对象,是目前比较流行Javascript异步编程解决方案之一或许是笔者理解能力有限,对官方术语怎么也感受不到亲切,下面我来用通俗易懂的语言解释下:Promise是一个包含三种状态的对象(pending.fulfilled.rejected),可以链式的处理异步请求(then方法)…

前端面试送命题（二）-callback，promise，generator，async-await

前言 本篇文章适合前端架构师,或者进阶的前端开发人员:我在面试vmware前端架构师的时候,被问到关于callback,promise,generator,async-await的问题. 首先我们回顾一下javascript异步的发展历程. ES6 以前: 回调函数(callback):nodejs express 中常用,ajax中常用. ES6: promise对象: nodejs最早有bluebird promise的雏形,axios中常用. generator函数:nodejs koa框…

前端通信：ajax设计方案（五）--- 集成promise规范，更优雅的书写代码（改迭代已作废，移步迭代10）

该迭代已作废,最新的请移步这里:https://www.cnblogs.com/GerryOfZhong/p/10726306.html 距离上一篇博客书写,又过去了大概几个月了,这段时间暂时离开了这个行业,让大脑休息一下.一个人旅行,一个人休息,正好也去完成一个目标 --- 拥有自己的驾照.当然,也把自己晒的黑漆马虎的.不过这一段时间虽然在技术上没有学太多东西,但是在心态上给了自己一个沉淀的机会,感觉自己变得更加沉稳和成熟,感觉这就是自己需要找到的自己,回归自我.好了,废话不多说了,虽然技术上…

阿里前端测试题--关于ES6中Promise函数的理解与应用

今天做了阿里前端的笔试题目,原题目是这样的 //实现mergePromise函数,把传进去的数组顺序先后执行,//并且把返回的数据先后放到数组data中 const timeout = ms => new Promise((resolve, reject) => {setTimeout(() => {resolve();}, ms);}); const ajax1 = () => timeout(2000).then(() => {console.log('1');retur…

前端的异步解决方案之Promise和Await-Async

异步编程模式在前端开发过程中,显得越来越重要.从最开始的XHR到封装后的Ajax都在试图解决异步编程过程中的问题.随着ES6新标准的出来,处理异步数据流的解决方案又有了新的变化.Promise就是这其中的一个.我们都知道,在传统的ajax请求中,当异步请求之间的数据存在依赖关系的时候,就可能产生很难看的多层回调,俗称”回调地狱”(callback hell).另一方面,往往错误处理的代码和正常的业务代码耦合在一起,造成代码会极其难看.为了让编程更美好,我们就需要引入promise来降低异步编程的…

【原创】分布式之数据库和缓存双写一致性方案解析(三) 前端面试送命题（二）-callback，promise，generator，async-await JS的进阶技巧 前端面试送命题（一）-JS三座大山 Nodejs的运行原理-科普篇 优化设计提高sql类数据库的性能 简单理解token机制

[原创]分布式之数据库和缓存双写一致性方案解析(三)   正文 博主本来觉得,<分布式之数据库和缓存双写一致性方案解析>,一文已经十分清晰.然而这一两天,有人在微信上私聊我,觉得应该要采用 先删缓存,再更新数据库,再删缓存 这一方案作为缓存更新策略,而不是先更新数据库,再删缓存.并且搬出了两篇大佬的文章,<Cache Aside Pattern>,<缓存与数据库不一致,咋办?>,希望博主能加以说明.因为问的人太多了,所以才有了这篇文章的诞生. 正文 在开始这篇文章之前,…

前端学习(三十六）promise（笔记）

一个页面:  头部.用户信息.新闻列表 jquery ajax:  1.$.ajax({    url:'',    dataType:'json', }).then(res=>{    //res :  成功后的返回},err=>{    //err: 失败的对象}); 2.let url = '';$.ajax({    url,    data:    dataType:    ...    success:function(res){        //res 成功后的数据    },…

前端萌新眼中的Promise及使用

一个 Promise 就是一个代表了异步操作最终完成或者失败的对象.这是MDN上关于Promise的解释.在前端开发中,Promise经常被拿来用于处理异步和回调的问题,来规避回调地狱和更好排布异步相关的代码.本篇文章对于Promise以及相关的async/await记录一些自己的理解和体会. 一.Promise的三种状态 从字面的意思理解,Promise即是承诺,既是承诺,那承诺的结果就会有成功和失败两种.而且,我们许下承诺之后不会立即得到结果,在获得成功或是失败的结果之前,我们还需要一点时间…

前端面试？这份手撸Promise请你收下

前言 现在很多大厂面试前端都会要求能够手动的写出一个Promise,所以这里整理了一份手写的Promise. 绝对详细,功能绝对强大.如果你不了解Promise的基本使用,那么本篇文章可能不太适合你,如果你对Promise有过一些了解,那么这篇文章绝对是你进阶的好帮手. 除开catch()以及finally()和allSettled接口没实现之外,其他的所有原生Promise支持的功能此手写的Promise都支持. 书写Promise的难度其实就在于then()方法的链式调用以及值穿透传递,其他…

前端常见原生方法的实现（bind，promise，new，extends，深拷贝，函数防抖，函数节流）

前端原生方法的实现,这里写一下常见的一些实现: 1.bind Function.prototype.bind2 = function (context) { var self = this; returnfunction () { self.apply(context); } } 2.promise class Promise { result: any; callbacks = []; failbacks = []; constructor(fn) { fn(this.resolve.bind…

前端基本知识（四）：JS的异步模式：1、回调函数；2、事件监听；3、观察者模式；4、promise对象

JavaScript语言将任务的执行模式可以分成两种:同步(Synchronous)和异步(Asychronous). “同步模式”就是一个任务完成之后,后边跟着一个任务接着执行:程序的执行顺序和排列顺序是一直的:”异步模式”则完全不同,每一个任务都有一个或者多个回调函数(callback),前一个任务结束的时候,不是执行下一个任务,二十执行回调函数,后一个任务则是不等前一个任务结束就执行,所以程序的执行顺序与任务顺序不一致的,异步的. 在浏览器端,耗时时间长的操作都应该异步执行,避免浏览器数去…

前端通信：ajax设计方案（十）--- 完善Promise A+规范，增加mock数据功能

半年不迭代,迭代搞半年,说的就是我,这里有点尴尬了,直接进入主题吧 我记得在这篇博客的时候集成了Promise的,不过那个时候就简简单单的写了一点最基础,在一些特殊的case上,还是有点问题的,所以才有了这个博客.在拜读了w3c和PromiseA+规范之后,从头到尾详细的了解了Promise这个东西,然后自己亲手写了一个和es6文档拥有相同功能的库. 什么是promise? promise是一个对象,表示单个异步操作的最终结果. 什么时候使用? 任何一门技术都不是一个“万金油”,只有在它最合适的…

前端基础进阶之Promise

前言 Promise的重要性我认为我没有必要多讲,概括起来说就是必须得掌握,而且还要掌握透彻.这篇文章的开头,主要跟大家分析一下,为什么会有Promise出现. 在实际的使用当中,有非常多的应用场景我们不能立即知道应该如何继续往下执行.最重要也是最主要的一个场景就是ajax请求.通俗来说,由于网速的不同,可能你得到返回值的时间也是不同的,这个时候我们就需要等待,结果出来了之后才知道怎么样继续下去. // 简单的ajax原生实现 var url = 'https://hq.tigerbrokers…

转【前端基础进阶之Promise】

前言 Promise的重要性我认为我没有必要多讲,概括起来说就是必须得掌握,而且还要掌握透彻.这篇文章的开头,主要跟大家分析一下,为什么会有Promise出现. 在实际的使用当中,有非常多的应用场景我们不能立即知道应该如何继续往下执行.最重要也是最主要的一个场景就是ajax请求.通俗来说,由于网速的不同,可能你得到返回值的时间也是不同的,这个时候我们就需要等待,结果出来了之后才知道怎么样继续下去. // 简单的ajax原生实现 var url = 'https://hq.tigerbrokers…

前端异步编程之Promise和async的用法

传统的异步解决方案采用回调函数和事件监听的方式,而这里主要记录两种异步编程的新方案: ES6的新语法Promise ES2017引入的async函数 Generator函数(略) Promise的含义 是异步变成的一种解决方案,属于ES6的语法. 简单的说,promise就是一个容器,里面包含着一个未来才会结束的事件(通常是一个异步操作)的结果. 比起传统的异步解决方案(回调函数和事件),promise更合理更强大,把异步操作以同步操作的流程表达出来,避免了层层嵌套的回调函数. Promise的…

前端项目中常用es6知识总结 -- Promise逃脱回调地狱

项目开发中一些常用的es6知识,主要是为以后分享小程序开发.node+koa项目开发以及vueSSR(vue服务端渲染)做个前置铺垫. 项目开发常用es6介绍 1.块级作用域 let const 2.箭头函数及this指向 3.promise. 4.async await语法 4.模块化 module export和import 5.解构赋值.字符串模板 …… Promise Promise是什么?不妨直接打印出来看吧! 在浏览器控制台输入console.dir( Promise )回车会有惊喜…

微信小程序前端promise封装

config.js const config = { base_url_api : "https://douban.uieee.com/v2/movie/", } export {config} http.js import { config } from "../config"; class HTTP { requset({ url, method = "GET", data = {} }) { const promise = new Prom…

【前端开发】】ES6属性promise封装js动画

如下是我写的demo源码: 可以直接复制用浏览器打开看到效果哦: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> #box{ width: 50px; height: 50px; background: red; position: absolut…

前端知识点回顾之重点篇——ES6的Promise对象

Promise Promise 是异步编程的一种解决方案,比传统的解决方案--回调函数和事件--更合理和更强大. 所谓Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果. Promise对象代表一个异步操作,有三种状态: pending(进行中).fulfilled(已成功)和rejected(已失败). 只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态. 回顾ES5中若要实现以下异步编程逻辑,将会形成回调地狱(回调不断嵌…

前端 ----- 初探ES6 Promise

前段时间做项目,在调用接口的时候,遇到了异步问题.开始是使用定时器,发现效果并不理想,于是又用了回调,效果还好但是,很明显的影响了代码的整洁性. 于是我想起了在面试的那段时间,背过的面试题里,出现过一个专为解决异步问题的新语法,ES6中的 Promise.接下来谈谈我对Promise的理解. 首先我们要搞清楚Promise的定义,Promise对象用于异步操作,它表示一个尚未完成且预计在未来完成的异步操作. 也就是说,Promise相当于一个承诺,我们许下承诺,当然就是用来完成的. 然后我们应该…

前端基础进阶（十三）：透彻掌握Promise的使用，读这篇就够了

Promise的重要性我认为我没有必要多讲,概括起来说就是必须得掌握,而且还要掌握透彻.这篇文章的开头,主要跟大家分析一下,为什么会有Promise出现. 在实际的使用当中,有非常多的应用场景我们不能立即知道应该如何继续往下执行.最重要也是最主要的一个场景就是ajax请求.通俗来说,由于网速的不同,可能你得到返回值的时间也是不同的,这个时候我们就需要等待,结果出来了之后才知道怎么样继续下去. // 简单的ajax原生实现 var url = 'https://hq.tigerbrokers.co…