breve introducción

Promesa objetos: representan un evento futuro (por lo general una operación asíncrona) se llevará a cabo.
Simplemente es un contenedor, que mantiene los resultados del evento terminará en algún momento en el futuro (por lo general una operación asíncrona). Sintácticamente, Promise es un objeto, puede obtener mensajes de la operación asincrónica de la misma.
Promise de un objeto ES6, operación asíncrona se puede expresar en un proceso sincronizado, una buena solución para el problema de demonios de devolución de llamada.

Devolución de llamada Infierno: una devolución de llamada función de devolución de llamada anidada o otros fenómenos de alta acoplamiento. Si hay un error de devolución de llamada demonios afectará a muchas otras partes, y de difícil mantenimiento y el desarrollo de secundaria.

Tres estados prometen objeto

estado de inicialización (estado de espera): en espera
estado de éxito: fullfilled
Estados fallidos: rechazadas

Los pasos básicos de la promesa

Crear una promesa objetos
Llamadas prometen función de devolución de entonces ()

objeto Promise tiene las siguientes dos características.

Estado del objeto sin influencia externa. Tres estados: pendientes (en curso), cumplido (tenido éxito) y rechazado (fallido). Solamente los resultados de las operaciones asincrónicas, se puede decidir qué tipo de estado actual, no hay otras operaciones pueden cambiar ese estado. Promise Este es el origen del nombre, que en Inglés significa "compromiso", dijo otro medio no se pueden cambiar.
Una vez que el cambio de estado, no va a cambiar en cualquier momento puede obtener este resultado . promesa objeto cambia de estado, sólo dos posibilidades: a partir de la pendiente de los cambios pendientes a ser cumplido y rechazado. Mientras estas dos cosas sucede en el estado de solidificación, no va a ser la misma y mantendrá el resultado, entonces llamado resuelto (finalizado).

gramática

La creación de una sintaxis de objetos promesa es la siguiente:

const promise = new Promise(function(resolve, reject) {
  // ... some code

  if (/* 异步操作成功 */){
    resolve(value);
  } else {
    reject(error);
  }
});

Promise constructor toma una función como un parámetro, dos parámetros son la determinación de función y rechazan. Son dos funciones proporcionadas por el motor de JavaScript, usted no tiene que implementar.
Función es la de resolver el papel del estado del objeto de la promesa "sin terminar" a "éxito" (es decir, cambiado de En espera de resolver), mediante convocatoria exitosa operación asincrónica, y el resultado de la operación asincrónica, para pasar a cabo como un parámetro;
Función es rechazar el papel del estado del objeto de Promise "sin terminar" a "fallido" (es decir, cambiado de En espera de Rechazado), se invoca cuando una operación asincrónica falla, y los errores de operación asíncronos pueden ser, como un parámetro para pasar hacia fuera .

.entonces

Después de generar Promise ejemplo, puede especificar una función de devolución de llamada estado resuelto por estado y luego rechazó Métodos.

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

para las castañas

Los siguientes parámetros se pueden ver que el código es una función constructora promesa flecha, una función de dos parámetros flecha resolución, rechazar. Esta vez la flecha en el estado de función "de la pendiente"
IF para determinar el estado de ejecución de las operaciones asincrónicas:

Si determinación implementación exitosa (), promesa que el estado se cambia automáticamente a fullfilled.
Si no se puede ejecutar rechazar (), promesa que el estado se cambia automáticamente a rechazado.

Los resultados de la instrucción if, que se ejecuta resolución () o rechazar (), independientemente de lo que uno puede dar promise.then () para pasar parámetros. promise.then(function(value) { // success}, function(error) { // failure });Si tiene éxito, promise.then llevará a cabo los parámetros del método 1, si falla, se ejecutará el método parámetro 2.
Aquí Insertar imagen Descripción
El código anterior salidas:
Me escribió la promesa es if(true)lo que lleva a cabo resolve(), a continuación, .thense ejecutará el primer argumento del método, que es la salida de "éxito".

Crear el éxito o el fracaso del objeto Promise

Es decir, si usted sólo tiene que lidiar con el éxito del fracaso del tratamiento o simplemente el resultado, puede ser abreviado. A continuación se presentan indicación equivalente.
Aquí Insertar imagen Descripción
Los errores pueden ser capturados entonces por el segundo argumento del método también se puede utilizar para capturar la captura de error. Las versiones son equivalentes.

complementario :

promise
.then(result => {···})		//两个参数方法，前面正确后面错误
.catch(error => {···})		//一个参数方法，只处理错误
.finally(() => {···});		//一个参数方法，正确错误都可以处理，ES2018出现

promesa 和 AJAX

Escribimos normalmente ajax así:

			var pro = new XMLHttpRequest;
			pro.open(method, url);
			pro.onreadystatechange = function() {
				if (pro.readyState == 4) {
					if (pro.status == 200 || pro.status == 304) {
						//处理成功请求
					} else {
						//处理失败请求
					}
				}
			}
			pro.send();

Esa promesa y cómo se combina con ajax. Siempre y cuando el método de parámetro de código promesa a moverse en a. A continuación, puede ser tratado con una resolución de declaración si () y rechazar ().
Aquí Insertar imagen Descripción
Por supuesto, la promesa de parámetros puede ser una función normal, la función puede también escribir flecha

		var ajaxPro = new Promise((resolve, reject) => {})
		var ajaxPro = new Promise(function(resolve, reject) {})

para las castañas

Los ejemplos se pueden ver en el éxito de mi petición. La sentencia if determinación introducido (pro), entonces los parámetros pasados a continuación, a continuación, la aplicación de la resolución, para dar salida al resultado de mi solicitud.
Aquí Insertar imagen Descripción

método nativo buscar a Ajax

El código siguiente es lo que he puesto en la parte superior de la pantalla se puede mejorar el aspecto, encapsular la promesa de ella, y luego regresó con los contenidos JSON.parse()en una cadena de JavaScript.

		let myUrl = "ajax/13promise.json";

//封装起来
		function promise(url) {
			return new Promise(function(resolve, reject) {
				var pro = new XMLHttpRequest;
				pro.open("GET", url);
				pro.onreadystatechange = function() {
					if (pro.readyState == 4) {
						if (pro.status == 200 || pro.status == 304) {
							resolve(pro);
						} else {
							reject(pro);
						}
					}
				}
				pro.send(null);
			})
		}
//调用
		var ajaxPro = promise(myUrl);
		
		ajaxPro.then(function(result) {
			var res = JSON.parse(result.responseText);
			console.log(res);		//输出 {name: "promisezzz", demo: "hahahahdemo"}
		}, function(err) {});

En la parte superior de este código es ayudar a entender la promesa de que, la escritura real del método ajax con ir a buscar muy bien. A continuación se da método Fetch:

		let myUrl = "ajax/13promise.json";
		fetch(myUrl).then(function(result){
			var res = result.json();
			res.then(function(response){
				console.log(response);		//输出 {name: "promisezzz", demo: "hahahahdemo"}
			})
		})