美文网首页
ECMAScript之Promise

ECMAScript之Promise

作者: 锋叔 | 来源:发表于2018-10-22 09:59 被阅读0次

学习Promise前我们先搞清楚这几个单词。

promise,resolve,reject => 承诺,解决,失败。
pending(进行中)、fulfilled(已成功)和rejected(已失败)

不是我装逼,只是为了你们别太low,自己谷歌一下这几个单词,然后好好发音,别发出扑若miss这种中不中西不西的奇怪发音。

关键词:异步编程。

随着前端语言的进化promise才诞生,现在已经统一了并且通用各大浏览器和规则。是异步编程截止18年来最好的解决方式之一。

ES6 规定,Promise对象是一个构造函数,用来生成Promise实例。

先来一个小例子,抄袭自阮一峰:

function timeout(ms){

    return new Promise((resolve, reject) => {

        setTimeout(resolve,ms,'done')

    })

}

timeout(2000).then((value) => { console.log(value) })

// => 两秒后打印出done

大概就是我给一个承诺,什么是承诺和诺言,可不是男人说的爱你一万年,程序是老实的,人家说我答应你执行这个就一定会执行,不执行我就会被干掉。那么实际例子中呢?

实战应用

  • 需求,当报销人改变我们需要做出一系列操作(异常麻烦和繁琐)

  • 问题:因为异常麻烦的操作和数据需要一定执行时间,这个时候我们一个关键数据后台最少要400毫秒后才能返回,而我们的一系列操作都基于这个数据,这些操作就不干了,谁尼玛等你这么久,我们报错去了。所以我们这会儿需要做一个异步来解决这个问题,也就是必须先拿到这个数据后才能执行其他操作。

// 方法
let initData = () => {

    return new Promise(){

        getData().then().catch();// 请求后台获取数据

        resolve();

    }

}

// 改变事件调用,

initData().then(()=>{

    // 执行七七八八的操作。

}).catch()

  • 关于Promis自带方法
  • then() // 成功;
  • catch()// 失败;
  • finally();// 成功和失败都会执行;
  • all();race();// 多个 Promise 实例,
  • reject();// 返回一个新的 Promise 实例

经典面试题:抄袭自不知名网友,想知道正确答案请留言。

  • 理解promise尝试得出打印结果(想知道答案的留言问我)。
setTimeout(function() { console.log(1)  }, 0);

new Promise(function executor(resolve) {

    console.log(2);

    for( var i=0 ; i<10000 ; i++ ) {    i == 9999 && resolve(); }

    console.log(3);

}).then(function() {

    console.log(4);

});

console.log(5);

相关文章

  • ECMAScript之Promise

    学习Promise前我们先搞清楚这几个单词。 promise,resolve,reject => 承诺,解决,失败...

  • JavaScript Promise 对象

    一、什么是Promise ECMAscript 6 提供了 Promise 对象。Promise 是异步编程的一个...

  • 会用不如会造 - Promise

    为什么要自己造 Promise Promise已经是Ecmascript 6标准中的内容 Promise是asyn...

  • Promise.resolve()

    参考文档:ECMAScript 6入门 Promise.resolve()用于将现有对象转换为Promise对象,...

  • 2018-11-07

    《ECMAScript 6》学习笔记 参考:阮一封ECMAScript 6 一、Promise对象 1. stac...

  • ES6 Promise 详解

    ECMAscript 6 原生提供了 Promise 对象。 Promise 对象代表了未来将要发生的事件,用来传...

  • ECMAScript Promise对象

    Promise的含义 Promise ,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)...

  • ECMAScript 6 Promise

    ES6 规定,Promise对象是一个构造函数,用来生成Promise实例。 Promise对象有以下两个特点。 ...

  • ECMAScript 6 入门--Promise 对象

    ECMAScript 6 入门--Promise 对象 所谓Promise,简单说就是一个容器,里面保存着某个未来...

  • JS----promise

    Promise 对象代表了未来将要发生的事件,用来传递异步操作的消息Promise是ECMAscript 6 的一...

网友评论

      本文标题:ECMAScript之Promise

      本文链接:https://www.haomeiwen.com/subject/bguwzftx.html