ionic3 异步请求中.then的作用，以及如何理解JavaScript Promise

Posted 2021-04-17 ionic大全

（给ionic大全加星标，提升ionic技能）

.then 概述

.then( )方法是promise的主要API，它可以注册回调，用来接收异步的返回值或处理异步抛出的错误。

理解javascript Promises

promise表示异步操作的最终结果，它是一个占位符，它将返回成功的返回值和失败的抛错。

为什么要使用 Promises？

与传统的基于回调的方法相比，Promise为执行、组合和管理异步操作提供了更简单的替代方案。它们还允许使用与同步类似的方法处理异步错误try/catch

Promises 状态

promises可以是以下三种状态之一：

• 待定（Pending）：promises的结果尚未确定，因为将产生其结果的异步操作尚未完成。

• 实现（Fulfilled）： 异步操作已完成，并且promise具有值。

• 拒绝（Rejected）：异步操作失败，promises永远不会实现。在被拒绝状态下，promises可以指示操作失败的原因。

当promises待定时，它可以转换为已履行或已拒绝的状态。然而，一旦promises得到实现或拒绝，它将永远不会过渡到任何其他状态，其返回值或失败原因不会改变。

Promise已经在多种语言中实现，JavaScript promises已经融合到Promises / A +提出的标准中。EcmaScript 6将提供promises作为主流的语言功能，它们将基于Promises / A +提出的方案。

使用promises

promise的主要API是它的then方法，这是一个简单的“hello world”程序，可以同步获取并记录返回值。

var greeting = sayHello();console.log(greeting); // 'hello world’

但是，如果sayHello是异步的并且需要从服务器查找当前返回值，它可能会返回一个promises：

var greetingPromise = sayHello();greetingPromise.then(function (greeting) { console.log(greeting); // 'hello world’});

相同的消息将打印到控制台，但现在其他代码可以在提取返回值时继续执行。

如上所述，promises也可能返回失败。如果网络出现故障并且无法从服务器获取返回值，你可以使用promise then方法的第二个参数处理错误信息：

var greetingPromise = sayHello();greetingPromise.then(function (greeting) { console.log(greeting); // 'hello world’}, function (error) {    console.error('Err: ', error);   // 'Err: something bad happened’});

如果sayHello成功，将记录'hello world’，但如果失败，则将记录错误原因，即错误console.error。

转化最终值

promises的一个强大功能是允许你通过从传递回来的回调函数返回一个新值来转换将来的值then。例如：

var greetingPromise = sayHello();greetingPromise.then(function (greeting) { return greeting + '!!!!';}).then(function (greeting) { console.log(greeting); // 'hello world!!!!’});

排序异步操作

传递给的函数then也可以返回另一个promise。这允许将异步操作链接在一起，从而保证它们以正确的顺序执行。例如，如果addExclamation是异步的（可能需要访问另一个服务器）并返回一个新的返回值promises：

var greetingPromise = sayHello();greetingPromise.then(function (greeting) { return addExclamation(greeting); // addExclamation returns a promise}).then(function (greeting) { console.log(greeting); // 'hello world!!!!’});

这可以更简单地写成：

var greetingPromise = sayHello();greetingPromise .then(addExclamation) .then(function (greeting) { console.log(greeting); // 'hello world!!!!’ });

处理错误

如果在执行异步操作时发生错误怎么办？例如，如果sayHello或addExclamation失败怎么办？在同步执行的代码中，你可以使用try/catch并依赖异常传播来处理一个位置的错误。这是前一个示例的同步版本，包括try/catch错误处理。如果在任一个sayHello或addExclamation（或者console.log）中发生错误，catch则将执行该代码块：

var greeting;try { greeting = sayHello(); greeting = addExclamation(greeting); console.log(greeting); // 'hello world!!!!’} catch(error) { console.error('Err: ', error); // 'Err: something bad happened’}

处理异步操作时，try/catch不能再使用同步。但是，promises允许以非常类似的方式处理异步错误。这使你不仅可以编写类似于同步代码的异步代码，还可以编写与同步代码类似的异步控制流和错误处理的原因。

这是一个异步版本，以相同的方式处理错误：

var greetingPromise = sayHello();greetingPromise .then(addExclamation) .then(function (greeting) { console.log(greeting); // 'hello world!!!!’ }, function(error) { console.error('Err: ', error); // 'Err: something bad happened’ });

请注意，就像同步示例一样，您可以使用单个错误处理块，在这种情况下作为第二个参数传递给最终调用的then。

由“一个神秘的程序猿”原创

转载请注明来源

觉得本文对你有帮助？请分享给更多人

为「ionic大全」加星标，提升ionic技能

喜欢就点一下「好看」呗~