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

//实现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. mysql数据库详解

    001 数据库应用系统设计 1.规划   2.需求分析   3.概念模型设计   4.逻辑设计   5.物理设计   6.程序编制及调试   7.运行及维护. 002 创建数据库 CREATE DAT ...

  2. Python 爬虫的集中简单方式

  3. Ant design 项目打包后报错:"Menu(or Flex) is not defined"

    我的项目使用了ant-design 和 ant-design-mobile,在测试环境上没问题,但是打包发布之后控制台报错 Menu is not defined Flex is not define ...

  4. js-滚动到指定位置导航栏固定顶部

    最近整理一下之前做的一个项目,把滚动条动态固定顶部的代码整理出来和大家分享,上代码 <!DOCTYPE html> <html> <head> <meta c ...

  5. css3+javascript旋转的3d盒子

    今天写点css3,3d属性写的3d盒子,结合javascript让盒子随鼠标旋转起来 今天带了css3新属性3d <!DOCTYPE html> <html> <head ...

  6. Linux制作deb

    1.新建一个我们临时的工作目录mkdir deb 2.新建我们程序的目录mkdir hello 3.编写我们的程序 我们以我们最熟悉的helloworld程序做起,hello.c代码如下#includ ...

  7. TreeMap----的实现原理(红黑树)

    TreeMap的实现是红黑树算法的实现,所以要了解TreeMap就必须对红黑树有一定的了解,其实这篇博文的名字叫做:根据红黑树的算法来分析TreeMap的实现,但是为了与Java提高篇系列博文保持一致 ...

  8. ASP.NET常用内置对象之——Server

    简介 Server对象是HttpServerUtility的一个实例,也是上下文对象context的一个属性,提供用于处理Web请求的Helper方法. 常用成员 一.Server.MapPath() ...

  9. JAVA程序员常用开发工具

    1.JDK (Java Development Kit)Java开发工具集 SUN的Java不仅提了一个丰富的语言和运行环境,而且还提了一个免费的Java开发工具集(JDK).开发人员和最终用户可以利 ...

  10. ps cs6破解补丁使用方法

    第一步.首先下载ps cs6破解补丁 ,再下载官方ps cs6中文版,安装之后运行一次.第二步.先备份你想要激活的软件的“amtlib”文件,比如PS CS6 64bit其目录在“C:\Program ...