一、含义

  是异步编程的一种解决方案,es 6 将其变成了标准。

  简单的说是一个容器,里面保存了某个未来才会结束的事件(通常是一个异步操作)的结果。语法上, Promise 是一个对象,从它可以获取异步操作的消息。

  Promise 对象有两个特点:

    1.状态,Promise 对象的状态不受外界影响。一个 Promise 对象代表一个异步操作,只会有三种状态:pending(进行中)、fulfilled(已成功)、rejected(已失败)。这三种状态只会受到异步操作的结果影响,其他都不能影响状态。

    2.一旦状态改变,则就无法再变,任何时候都可以得到这个结果。状态改变后,会一直保持这个结果,称之为 resolved(已定型)。且在改变发生之后,再对 Promise 对象添加回调函数,也会立即得到这个结果(然而这句没理解)。

二、基本用法

const promise = new Promise((resolve, reject) => {
// ... some code if (/* 异步操作成功 */){
resolve(value);
} else {
reject(error);
}
});

  目前项目中常用的写法:

new Promise((resolve, reject) => {
login(username, userInfo.password).then(response => {
const data = response.data
setToken(data.token)
commit('SET_TOKEN', data.token)
resolve()
}).catch(error => {
reject(error)
})

  resolve 和 reject 函数由 js 引擎提供,不用自己部署;

  resolve 的作用是,将 Promise 对象的状态从 pending 变成 fulfilled ,在异步操作成功时候调用,并将操作的结果,作为参数传递出去;

  reject 的作用是,将 Promise 对象的状态从 pending 变成 rejected,在异步操作失败时候调用,并将操作报出的错误,作为参数传递出去;

  

  Promise 实例生成后,可以用 then 分别指定 fulfilled 状态和 rejected 状态的回调函数:

promise.then(function(value) {
// success
}, function(error) {
// failure
});

  一般而言,Promise 在新建后就会立即执行,然后执行脚本中接下来的同步任务,所有的同步任务执行完成后,才会执行 then 方法指定的回调函数。

三、用途

  1.加载图片

const preloadImage = function (path) {
return new Promise(function (resolve, reject) {
const image = new Image();
image.onload = resolve;
image.onerror = reject;
image.src = path;
});
};

  2.ajax请求

ES 6 系列 - Promise的更多相关文章

  1. OpenGL ES教程系列(经典合集)

    为了搞透播放器的开发,花了些时间收集这些资料,虽然我已经搞定opengles渲染视频的内容,但是想玩玩opengles,往深里玩,图像处理这块是个好的方向,所以opengles是值得好好学的.   O ...

  2. js 深入原理讲解系列-Promise

    js 深入原理讲解系列-Promise 能看懂这一题你就掌握了 js Promise 的核心原理 不要专业的术语,说人话,讲明白! Q: 输出下面 console.log 的正确的顺序? const ...

  3. es6 快速入门 系列 —— promise

    其他章节请看: es6 快速入门 系列 Promise Promise 是一种异步编程的选择 初步认识Promise 用 Promise 来实现这样一个功能:发送一个 ajax,返回后输出 json ...

  4. JS 异步系列 —— Promise 札记

    Promise 研究 Promise 的动机大体有以下几点: 对其 api 的不熟悉以及对实现机制的好奇; 很多库(比如 fetch)是基于 Promise 封装的,那么要了解这些库的前置条件得先熟悉 ...

  5. Android OpenGL ES 入门系列(二) --- 环境搭建

    转载请注明出处 本文出自Hansion的博客 本章介绍如何使用GLSurfaceView和GLSurfaceView.Renderer完成在Activity中的最简单实现. 1.在AndroidMan ...

  6. Android OpenGL ES 入门系列(一) --- 了解OpenGL ES的前世今生

    转载请注明出处 本文出自Hansion的博客 OpenGL ES (OpenGL for Embedded Systems) 是 OpenGL 三维图形 API 的子集,针对手机.PDA和游戏主机等嵌 ...

  7. ES 6 系列 - Module 的语法

    es 6 大幅度优化了模块化编程的规范. 写在前面:在 es6 之前,说起 js 的模块化,一般都避不开 CommonJs 和 AMD 两种方案.这两种方案,前者应用于服务器,后者应用于浏览器.而 e ...

  8. ES 6 系列 - Proxy

    Proxy 用于修改某些操作的默认行为,等同于在语言层面做出修改,所以是一种“元编程”,即对编程语言进行编程. 简单地理解,就是在目标对象之前假设一层“拦截”,外界对改对象的访问,都必须先通过这层拦截 ...

  9. ES 6 系列 - 对于常用对象的拓展 api

    本篇中学习并记录可能会比较常用的 api ,详细请自行查找相关资料. 一.字符串的拓展 es 6 加强了对于 Unicode 的支持.javascript 允许采用 \uxxxxx 的方式表示一个字符 ...

随机推荐

  1. Java中class的getName()和getCanonicalName()两个方法的区别

    getName()返回的是虚拟机里面的class的表示 getCanonicalName()返回的是更容易理解的表示 对于普通类来说,二者没什么区别,只是对于特殊的类型上有点表示差异 比如byte[] ...

  2. Flask框架简介,常用扩展包及两大核心

    Flask诞生于2010年,是Armin ronacher(人名)用 Python 语言基于 Werkzeug 工具箱编写的轻量级Web开发框架. Flask 本身相当于一个内核,其他几乎所有的功能都 ...

  3. 初学Python——第一节课

    一.Python语言的特性: 1.与C语言不同,Python语言是一门解释性语言.程序在执行过程中,执行一步.编译一步. 2.Python是一个动态类型语言,不需要定义变量的数据类型. 3.Pytho ...

  4. OpenCV3编程入门笔记(一)

    ---恢复内容开始--- 图像处理技术一般包括图像压缩,增强和复原,匹配.描述和识别3个部分.图像处理和计算机视觉的区别在于:图像处理侧重于“处理”图像——如增强.还原.去噪.分割等:而计算机视觉重点 ...

  5. Python排序算法——快速排序

    有趣的事,Python永远不会缺席! 如需转发,请注明出处:小婷儿的python https://www.cnblogs.com/xxtalhr/p/10768593.html 排序算法(Sortin ...

  6. Linux下快速配置Java开发环境

    1.下载 jdk8官网下载地址 http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html ...

  7. 深入浅出Tomcat/3 - Tomcat生命周期

    在上面的部分,其实我们已经接触到Tomcat的生命周期了,接下来我们将仔细讨论和学习Tomcat的生命周期的具体实现. LifeCycle接口 这个LifeCycle接口上面在讲解Server和Ser ...

  8. NetCore实践篇:分布式监控客户端ZipkinTracer从入门到放弃之路

    前言 本文紧接上篇.Net架构篇:思考如何设计一款实用的分布式监控系统?,上篇仅仅是个思考篇,跟本文没有太大的关系.但有思考,结合现有的开源组件,实践起来更易理解起来,所以看本文之前,应该先看下上篇博 ...

  9. Autofac踩坑经历

    背景 接口框架使用反射,动态生成Controller,使用Autofac进行依赖注入,并替换默认DependencyResolver及IControllerFactory,Controller实例化代 ...

  10. H5 69-清除浮动方式四

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...