今天做了阿里前端的笔试题目,原题目是这样的

//实现mergePromise函数,把传进去的数组顺序先后执行,
//并且把返回的数据先后放到数组data中

const timeout = ms => new Promise((resolve, reject) => {
setTimeout(() => {
resolve();
}, ms);
});

const ajax1 = () => timeout(2000).then(() => {
console.log('1');
return 1;
});

const ajax2 = () => timeout(1000).then(() => {
console.log('2');
return 2;
});

const ajax3 = () => timeout(2000).then(() => {
console.log('3');
return 3;
});

const mergePromise = ajaxArray => {
// 在这里实现你的代码

};

mergePromise([ajax1, ajax2, ajax3]).then(data => {
console.log('done');
console.log(data); // data 为 [1, 2, 3]
});

// 分别输出
// 1
// 2
// 3
// done
// [1, 2, 3]

从网上找到的答案我写贴上:

var data = [];
var sequence = Promise.resolve();
ajaxArray.forEach(function(item){
  sequence = sequence.then(item).then(function(res){
    data.push(res);
    return data;
  });
})

return sequence;

解答思路和原理有空再研究贴上来。

更新--思路解析:

  首先理解一下javascript的执行机制--异步执行,也就是说两个并列函数的执行顺序不会先执行完第一个,再执行后一个。举个栗子:

func A(){

  setTimeout(function(){

    console.log('a');

},3000);

}

func B(){

  setTimeout(function(){

    console.log('b');

},1000);

}

A();

B();

那么你觉得输出结果是啥?不妨试下,会输出b,a.

原因就是异步执行。当执行到A函数时,会注册一个三秒后执行的函数,直接去执行B,而不是等三秒执行完A再去执行B。

promise可以实现同步执行

先说一下使用方法吧:promise和then配合使用,类似于回调函数,执行完promise之后才会执行then的内容

new Promise((resolve, reject) {

}).then(function(){

}).then(function(){})...

promise里面的两个参数表示promise的执行状态

但是值得注意的是then里面的东西可不是同步执行,并不是前一个执行完再执行后一个,then之间还是遵循异步原则的。

所以JavaScript、nodejs想要实现同步,各路神仙都有自己不同的理解和套路。

后续更新。

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

  1. ES6中Promise对象个人理解

    Promise是ES6原生提供的一个用来传递异步消息的对象.它减少了传统ajax金字塔回调,可以将异步操作以同步操作的流程表达出来使得代码维护和可读性方面好很多. Promise的状态: 既然是用来传 ...

  2. 前端面试之ES6中的继承!

    前端面试之ES6中的继承! ES6之前并没有给我们提供 extends继承.我们可以通过构造函数+原型对象模拟实现继承,被称为组合继承. 1 call() 两个作用: 1 调用这个函数! 2 修改函数 ...

  3. Es6中箭头函数与普通函数的区别

    Es6中箭头函数与普通函数的区别? 普通function的声明在变量提升中是最高的,箭头函数没有函数提升 箭头函数没有属于自己的this,arguments 箭头函数不能作为构造函数,不能被new,没 ...

  4. 对于ES6中Promise的个人见解

    1.js中常见的异步 JavaScript可以响应用户的一些异步交互,比如单击鼠标和按键盘等操作. let button = document.getElementById("btn&quo ...

  5. ES6中promise总结

    一.什么是ES6的Promise 讲太多也没有.直接在打印出来就好,console.dir(Promise) Promise 是一个构造函数,自身有all, reject, resolve 这几个眼熟 ...

  6. ES6中promise的使用方法

    先看看ES5中异步编程的使用. let ajax = function (callBlack) { setTimeout(function () { callBlack && call ...

  7. es6中的函数

    ES6 允许为函数的参数设置默认值,即直接写在参数定义的后面. function log(x, y = 'World') { console.log(x, y); } log('Hello') // ...

  8. ES6的promise函数用法讲解

    总结:Promise函数的出现极大的解决了Js中的异步调用代码逻辑编写太过复杂的问题,Promise对象让异步调用函数的流程显得更加的优雅,也更容易编写. 举例: 1. 异步调用: 假设现在我的一个页 ...

  9. ES6中箭头函数的作用

    我们知道在ES6中,引入了箭头函数,其本质就是等同有ES5中的函数.类似于下面的写法: let test1=() => “abc”; let test2=() => { return “a ...

随机推荐

  1. 把一个项目a生成后放在另一个项目b使用(b项目是例子中的ScreenWebPage_Tool)

    a项目属性---生成事件---后期生成事件命令行   xcopy /r /y  $(TargetDir)*.* $(SolutionDir)ScreenWebPage_Tool\bin\Debug\* ...

  2. innerHTML、innerText、outerHTML、textContent的区别

    示例html代码: <div id="test"> <span style="color:red">test1</span> ...

  3. alert 多语言的处理

    1. code <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <m ...

  4. MySQL数据库(5)----删除或更新已有行

    有时候,会需要删除某些行,或者修改其内容.这是候便需要用到DELETE语句和UPDATE语句. 1. DELETE 语句的基本格式如下所示: DELETE FROM tbl_name WHERE wh ...

  5. 转:hive-列转行和行转列

    1. 假设我们在hive中有两张表,其中一张表是存用户基本信息,另一张表是存用户的地址信息等,表数据假设如下: user_basic_info: id name 1 a 2 b 3 c 4 d use ...

  6. php 环境搭配 脚本模式(1)

    php介绍目标1:<?phpecho 'hello world'; //配置好了apacheecho '<br/> 现在时间:" .date(’Y-m-d H:i:s‘)“ ...

  7. Element和vue框架报错提示

    上面报错提示Error in render function: "TypeError:Cannot read property '$options' of undefined" 就 ...

  8. Fatal error: Call to undefined function fnmatch() 解决

    我的PHP版本是5.6.30,linux 是CentOS 6.6,nginx,也不知啥问题,看了官方: https://secure.php.net/manual/en/function.fnmatc ...

  9. Hibernate初探之单表映射

    http://www.imooc.com/video/7816 1.什么是ORM?为什么使用Hibernate? 对象关系映射:为了少写和底层数据库相关的sql语句,方便程序的维护.修改,提高跨平台性 ...

  10. ue-edit设置显示函数列表

    UltraEdit的函数列表竟然不显示函数,那这功能要它何用,应该如何才能让函数显示出来呢? 公司编程基本上都在UltraEdit中进行,俺刚来公司还不熟悉,今天装了个UltraEdit,可是看着别人 ...