精华内容
下载资源
问答
  • Javascript 在循环使用Promise对象

    万次阅读 2017-07-15 12:33:28
    先看一个生成Promise对象的方法 function createPromise() { var promise; promise = new Promise(function(resolve, reject) { var elapse = Math.random() * 2000; setTimeout(resolv

    先看一个生成Promise对象的方法

     function createPromise() {
            var promise;
            promise = new Promise(function(resolve, reject) {
                var elapse = Math.random() * 2000;
                setTimeout(resolve, elapse);
            });
            return promise;
    
    
        }

    目标是生成10个Promise对象并依次输出Promise的结果。

    首先看这种调用方式:

     for (var i = 0; i < 10; i++) {
                createPromise().then(function() {
                console.log(i);
                })
            }

    由于Promise是异步调用,then内的回调函数在for循环之后调用,所以在所有的then callback里面,i=10。所以输出为
    10
    10
    10
    10
    10
    10
    10
    10
    10
    10

    换另外一种调用方式

      var promiseArray = [];
            for (var i = 0; i < 10; i++) {
                promiseArray.push(createPromise());
            }
            Promise.all(promiseArray).then(function() {
                 for (i = 0; i < data.length; i++)
                     console.log(i);
                     })

    因为Promise.all函数可以并行调用参数中的Promise对象方法,并且将所有Promise对象方法返回值作为数组输入到then回调中,因此这种方式调用可以解决Promise的循环创建和调用。

    展开全文
  • promise循环

    2019-03-17 21:22:31
    var tasks=[]; function output(j) {... var promise = new Promise( function(resolve, reject) { setTimeout(function () { console.log(j); resolve(j); },1000 * i); }); pr...
     var tasks=[];
    			function output(j) {
    				var promise = new Promise( function(resolve, reject) {
    				setTimeout(function () {
    				console.log(j);
    				resolve(j);
    				},1000 * i);
    				});
    				
    				promise.then(function (j) {
    				});
    				return promise;
    			}
    			for (var i=0;i<5;i++){
                    tasks.push(output(i));
    			} 
    			Promise.all(tasks).then(function () {
    			setTimeout(function () {
    			console.log('Promise循环完事了');
    			},1000);
    			});

     

    参考页:https://www.jianshu.com/p/f5ec536c2c92/

    展开全文
  • js中数组循环调用异步方法,想顺序执行怎么办? nodejs实现时,我习惯使用async模块的eachSeries方法,依次对数组中item操作,数据全部处理完毕之后继续下面的业务;随便链个async模块使用教程地址:...

    js中数组循环调用异步方法,想顺序执行怎么办?
    nodejs实现时,我习惯使用async模块的eachSeries方法,依次对数组中item操作,数据全部处理完毕之后继续下面的业务;随便链个async模块使用教程地址:https://blog.csdn.net/limite_god/article/details/41486901
    可喜可贺的是ES6标准中包括了Promise对象;阮大神的教程地址:http://es6.ruanyifeng.com/#docs/promise
    今天写代码,想实现对数组中数据循环处理,分别调用异步函数,全部操作完毕之后再继续业务处理(回显提示信息什么的);之前没用过Promise对象,先简单实现个demo;

        //测试异步流程控制
        let myData = ['a','b','c','d','e'];
        //异步处理方法,返回Promise对象
        let f1 = function(i){
          return new Promise(function (resolve, reject) {
            setTimeout(function () {
              console.log("一个异步操作,处理数据:" +myData[i]);
              resolve();
            }, 500);
          });
        };
        let loopNum = 0;//循环标识
        //定义流程控制函数,递归实现依次调用f1
        let asyncControl = function(){
          if (loopNum < myData.length){//
            f1(loopNum).then(function () {
              loopNum++;
              asyncControl();
            });
          }else{
            console.log('数据全部处理完了');
          }
        }
        //执行流程控制函数
        asyncControl();

    执行结果

    demo执行结果

    第一次用Promise对象实现异步流程控制,感觉不错~

    展开全文
  • 在极客时间大牛的重学前端的《Promise 里的代码为什么比 setTimeout 先执行?》的结尾,大牛留了一道题:我们现在要实现一个红绿灯,把一个圆形 div 按照绿色 3 秒,黄色 1 秒,红色 2 秒循环改变背景颜色,你会怎样...

    在极客时间大牛的重学前端的《Promise 里的代码为什么比 setTimeout 先执行?》的结尾,大牛留了一道题:

    我们现在要实现一个红绿灯,把一个圆形 div 按照绿色 3 秒,黄色 1 秒,红色 2 秒循环改变背景颜色,你会怎样编写这个代码呢?复制代码

    我的解答如下:

    <!DOCTYPE html>
    <head>
        <meta charset="UTF-8"/>
        <meta name='viewport'/>
        <title>Document</title>
            #colorDiv {
                width: 50px;
                height: 50px;        
                border-radius: 100%;
            }
    	</style>
    </head>
    <body>
        <div id="colorDiv"></div>
    </body>
    
    <script>
        let trafficLightDiv = document.getElementById('colorDiv')
        function changeTrafficLight(duration, color) {
                // 改变 div 背景颜色
                trafficLightDiv.style.backgroundColor = color
                // 延迟执行回调
                setTimeout(resolve, duration)
            })
        }
    	
        async function trafficLightFun() {
            await changeTrafficLight(3000, 'green')    
            await changeTrafficLight(1000, 'yellow')
            await changeTrafficLight(2000, 'red')
            await changeTrafficLight(1000, 'yellow')
            trafficLightFun()
        }
    	
        trafficLightFun()
    </script>复制代码


    展开全文
  • js事件循环+promise

    2020-06-30 10:06:58
    事件循环其实就是:执行栈,宿主环境,事件队列3个之间的配合!!!!!!!! 执行栈:call stack 是所有函数执行的一个环境, 只有执行栈里面空闲了,才去执行事件队列里面的事件。 JS引擎永远执行的是执行栈...
  • 项目需要前端循环遍历一个接口获取信息,promise可以保证每次接口遍历正常后统一保存返回的数据 首先: 封装Promise fn(jsonData,config,index){ return new Promise((resolve, reject) => { upload(jsonData,...
  • 微任务:process.nextTick(Node.js)MutationObserver(浏览器),Promise.prototype.then()/catch()/finally()。 requestAnimationFrame是宏任务还是微任务? 有4种不同的情况: 宏任务里面新建宏任务:加入宏任
  • 使用场景: 有多个ajax请求,需要在所有请求都返回结果后回调,执行其他操作。 let len = 10; //循环次数(实际按需求修改) let arr = []; //promise返回值的数组 for (let i = 0; i < len; i++) { arr[i] =...
  • 当我们想依次执行多个异步请求时,或者实现setTimeout为setInterval时,可以使用Promise对象和async await关键字来实现该功能。 尤其是,我们在使用node做网络爬虫时,需要进行大量的依次进行的异步请求。 波及到...
  • 可是如果想让所有的(例如循环调用的若干次)异步方法全部执行完之后再执行接下来的方法该怎么办呢? 本文基于Promise语法,给出解决方案。 接着上一篇的例子,我们先来看一下有问题的写法。 有问题的写法: var...
  • javascript 使用promise

    2019-01-08 19:11:04
    使用JavaScript编写代码会大量的依赖异步计算,计算那些我们现在不需要但将来某个时候可能需要的值。ES6引入一个新概念,用于更简单的异步任务:promise。...使用promise的一个最佳的例子是从服务...
  • Promise.resolve()的四种参数情况中的“无参数”,直接返回一个resolved状态的 Promise 对象,此时resolve的 Promise 对象是在本轮“事件循环”(event loop)的结束时,而不是在下一轮“事件循环”的开始时。...
  • promiseList.push(new Promise((resolve, reject)=> { summaryApi.addSummary(formData).then(res =>{//for循环中请求接口 if (res.status) { this.count++ resolve(i) } }) })) } Promise.all(promiseList).then...
  • 拼接的数组必须是最终遍历的结果,所以得等到所有的请求结束之后进行操作,使用map可以返回每一次异步请求的Promise合集,注意这里不需要return,然后使用Promise.all等待执行完所有的异步操作,然后才会执行后面的...
  • function Promise (executor) { var self = this; self.status = 'pending'; self.value; self.reason; self.onResolvedCallbacks = []; // 存放所有成功的回调。 self.onRejectedCallbacks = []; // 存放
  • Promise + 事件循环

    2021-02-03 16:25:43
    Promise + 时间循环 怎样实现一个promise? 1.promise是一个类,类中需要一个executor执行器,默认会立即执行。(相当于直接在栈中执行,是一个宏任务。而then后面的微任务,当一个宏任务执行完成后就会清空事件队列...
  • Promise循环用法

    千次阅读 2019-05-21 09:28:35
    用到Promise的静态方法Promise.resolve(); 返回值是一个Promise对象 var promise1 = Promise.resolve(123); promise1.then(function(value) { console.log(value);...没有循环之前我是这么做的 // 把网络图片改成...
  • promise 循环异步 1从setTimeout到Promise (1 From setTimeout to Promise) I remember vividly when I first stumbled on the term “asynchronous”, the first thing jumped into my head was it must have ...
  • 前言 在实际开发中,碰到参数不同,接口相同,需要发送多个请求拿到数据后统一做处理的情况,例如:模块总退出... const promise = array.map(i=>{ const url = 'http://197.1.1.1/login?user='+i return new P
  • for循环中进行Promise异步操作的问题总结

    万次阅读 多人点赞 2017-06-20 18:11:18
    笔者在for循环中进行Promise异步操作的时候,主要会遇到两个问题: 一是如何让所有的for循环中的Promise操作结束后执行某个操作 二是循环中如果后一个Promise的执行依赖与前一个Promise的执行结果(例如对于某个...
  • node里根据传过来的一串数字,循环读取JSON文件,拼接读取结果,并返回值 // 获取购物车列表 app.get('/getshopcarlist/', function (req, res) { //这里传过来一串 ,分隔的数字 穿过来的值为类似 23,27,98 数字...
  • Promise 对象循环调用

    2020-03-31 15:16:27
    解答: ...首先定义一个可重复调用 Promise 的方法 functionretry(){ varpromise; promise=newPromise(function(resolve,reject){ varelapse=Math.random()*2000; setTimeout(resolve,elapse); ...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 31,271
精华内容 12,508
关键字:

循环使用promise