人生苦短我用async/await

作者 likaiqiang 日期 2017-09-03
人生苦短我用async/await

遇到的问题

最近做的项目每一个都给我惊喜,上一个是项目的某个地方特别适合vuex,于是我就厚着脸皮在那个小不点项目里面使用了vuex,在这之前,我也迷信所谓的小项目不用vuex,大项目才需要,这次经历后我发现说这话的人都没有使用过vuex,最起码不知道vue推出这项技术是解决什么问题的。。。

我对当下流行的ES6、ES7是持中立态度的,既不会完全排斥他们,也不是脑残粉似的完全使用他们,我始终认为新技术是解决老问题的,项目中不存在这种问题,就不需要使用他们。比如一提ES6,大家第一反应就是箭头函数,其实箭头函数最方便的地方是解决了this的问题,某些地方不使用this就不需要用箭头函数。但是如果项目中存在这种问题,就需要ES6,甚至是ES7来救场。

这次的项目某个地方异步回调特别多,有些还是回调里面嵌套回调。举一个省市县联动的效果来说明一下吧,某些场景我只需要请求省份的数据,某些场景这个联动效果页面是从别的页面跳转过来的,跳过来后带着许多参数,这些参数依次是省市区联动效果的默认值,比如默认陕西 西安 雁塔区,或者江苏 苏州,默认参数不仅内容是不定的,个数也是不定的。

实现这种需求,就要明确知道每一个异步请求是什么时候返回的。比如说默认参数是 陕西 西安 雁塔区,先请求省份数据,等省份数据加载完毕(我需要知道的第一个明确时间)选中陕西,然后请求陕西下的所有城市,等城市数据加载完毕(我需要知道的第二个明确时间)选中西安,最后请求县城数据,等县城数据加载完毕(我需要明确知道的第三个时间)选中雁塔区。当然,很可能只有两个参数 陕西 西安。

按照以前的玩法,回调地狱,想想都痛苦。后来又试着用promise,promise的then写法虽然使回调更可控,但从本质上来讲仍然存在回调地狱。最后使用async/await解决了这个问题。
(未完)