var i = 0; i++; function ajax(url){ return new Promise(function(resolve, reject){ setTimeout(function(){ console.log(url); resolve({url: url + i++}); }, 200); }); } function *gen(url){ var data = yield ajax(url); data = yield ajax(data.url); data = y…

我们先来看一下编写AJAX编码经常遇到的几个问题: 1.由于AJAX是异步的,所有依赖AJAX返回结果的代码必需写在AJAX回调函数中.这就不可避免地形成了嵌套,ajax等异步操作越多,嵌套层次就会越深,代码可读性就会越差. $.ajax({ url: url, data: dataObject, success: function(){ console.log("I depend on ajax result."); }, error: function(){} }); consol…

用了 Promise 其实并没有真正解决回调地狱问题,并且还新增了很多 .then(data => { .... }) 这些很没有意义的 “模板代码”.所以先人们又搞出了generator 和 async/await,generator 有一些很神奇的特性这个就不多说了,自己看 MDN 上的文档就好,但是 generator 也能挺方便地处理异步. 一.promise+迭代器=生成器 首先我们需要了解什么是迭代器( iterator),迭代就是指提供了统一的遍历复杂数据类型的方案.我们先回忆一下…

co.js是基于es6的generator实现的,相当于generator函数的一个自动执行器 generator的简单介绍 function* fn(){ before() yield firstYield() yield secYield() end() } let gen = fn()//生成构造器 gen.next()//执行到第一个yield的位置,即只执行before(),firstYield() gen.next()//执行到第二个yield的位置,只执行secYield() ge…

1.工作中遇到这么一个问题:有多个按钮,点击不同的按钮发送不同的请求(传的id不同)并显示弹窗,弹窗里要展示后端发送回来的数据.但是比如点击第二个按钮,弹窗里显示的仍然是第一个弹窗里的数据. 2.原因:因为第二次点击发送请求,第二次的数据还未返回,所以展示的仍然是第一次的数据 3.解决方案:在ComponentWillReceiveProps里比较新旧数据,当新旧数据不一样的时候再进行数据的展示等操作…

Promise,我们了解到promise是ES6为解决异步回调而生,避免出现这种回调地狱,那么为何又需要Async/Await呢?你是不是和我一样对Async/Await感兴趣以及想知道如何使用,下面一起来看看这篇文章:Async/Await替代Promise的6个理由. 什么是Async/Await? async/await是写异步代码的新方式,以前的方法有回调函数和Promise. async/await是基于Promise实现的,它不能用于普通的回调函数. async/await与Prom…

先看如何使用 使用的npm包为genny,npm 安装genny,使用 node -harmony 文件(-harmony 为使用es6属性启动参数) 启动项目 var genny= require('genny'); genny.run(function* (resume) { console.log("Hello"); yield setTimeout(resume(), 1000); console.log("World"); }); 输出Hello 暂停1秒…

回调函数 : 函数作为参数传递到另外一个函数中.简单数据类型和引入数据类型中的数组和对象作为参数传递大家肯定都不陌生,其实引用数据类型中的函数也是可以的. 事实上大家见到的很多,用到的也很多,比如jQuery中的一些事件,定时器.这些呢都是别人搞好的,大家直接用,所以就没有太在意. /注意到click方法中是一个函数而不是一个变量 //它就是回调函数 $("#btn_1").click(function() { alert("Btn 1 Clicked"); });…

使用Promise链式调用解决多个异步回调的问题 比如我们平常经常遇到的一种情况: 网站中需要先获取用户名,然后再根据用户名去获取用户信息.这里获取用户名getUserName()和获取用户信息getUser()都是调用接口的异步请求.在获取用户信息之前,需要先获得用户名.也就是说getUser依赖于getUserName的状态. 一:promise.all() function getUserPromise(promiseX, promiseY){ return Promise.all([pr…

回调(callback)在我们做工程过程中经常会使用到,今天想整理一下回调的原理和使用方法. 回调的原理可以简单理解为:A发送消息给B,B处理完后告诉A处理结果.再简单点就是A调用B,B调用A. 那么是如何实现的呢?一般而言,处理消息的类是唯一的,而发送消息的类却是各种各样的,所以一般的做法是将回调方法做成一个接口,不同的发送者去实现该接口,并且把自己的接口实现类的对象在发送消息时传递给消息处理者. (现在不太方便画图,之后再补上图) 现在以一个CS结构的示例来说明回调的过程: Client类:…