Question

我正在阅读有关JS Promises的技能。

这是我的要求：假设你想要console.log('we done, bruh!') AFTER ，你的数据会回来。

所以有了承诺，你可能会说：

let iWantToLogOut = function() {

    let data = fetch('https://jsonplaceholder.typicode.com/users')

    return new Promise((resolve) => {
        resolve(data)
    })
}

然后解决这样的承诺：

iWantToLogOut().then((dataBack) 
=> databack.json())
 .then((json) => {
   console.log('We done, bruh! Look: ', json)         
 })

这太好了。你得到了你的API数据，然后我们记录了我们的消息。

但这不是一件容易的事情：

   let data = fetch('https://jsonplaceholder.typicode.com/users');
   data ? console.log('we done, bruh!') : null;

我可能过度简化/遗漏了一些东西（因为......好吧......我很迟钝）但我只是想确保在我之前我真正理解Promises转到Async / Await。

Answer 1

但这并不容易：

let data = fetch('https://jsonplaceholder.typicode.com/users');
data ? console.log('we done, bruh!') : null;

它会，但它不起作用。 fetch返回的是承诺，而不是操作的结果。您无法返回异步进程的结果。更多：How do I return the response from an asynchronous call?

在即将发布的ES2017规范中，我们有关于承诺消费的语法糖，可以让你写下这个：

let data = await fetch('https://jsonplaceholder.typicode.com/users');
// --------^^^^^
console.log('we done, bruh!');

请注意，我们甚至不需要条件，因为await会将承诺拒绝转换为异常。

该代码需要在async函数中，例如：

(async function() {
    let data = await fetch(/*...*/);
    // use data here
})();

某些浏览器中的JavaScript引擎已经支持async / await，但要在野外使用它，您需要与Babel或类似的一起进行转换。

注意：您已经显示

所以有了承诺，你可能会说：

let iWantToLogOut = function() {

    let data = fetch('https://jsonplaceholder.typicode.com/users')

    return new Promise((resolve) => {
        resolve(data)
    })
}

该代码存在一些问题：

如果fetch失败，它永远无法解决您创建的承诺。
它会调用data这些不是数据的内容，而是承诺数据（这主要是风格，但它具有误导性））。
展示承诺创建反模式。您已经有了承诺（来自fetch），无需创建另一个承诺。

iWantToLogOut应该简单：

let iWantToLogOut = function() {
    return fetch('https://jsonplaceholder.typicode.com/users');
};

返回一个将使用数据解决的承诺，当然也会被拒绝。然后您将使用承诺方法或await（在async函数内）使用。

Answer 2

这不是一件容易的事。通常网络调用应该异步处理（我不想要同步AJAX调用的反模式）。那时你几乎没有选择来处理它：

回调
承诺
观测量

在上面的代码中，当它同步时，fetch应立即返回一个承诺，只有在服务器响应时才会解析数据。只有这样，您才能检查数据的内容。进一步。因为每个承诺都可以实现或失败，在你当时你可以拥有一个处理程序，而不是使用三元组。

来自最新规范：

工作人员之外的同步XMLHttpRequest正在从Web平台中删除，因为它会对最终用户的体验产生不利影响。（这是一个需要很多年的漫长过程。）当前全局对象是Window对象时，开发人员不能为异步参数传递false。强烈建议用户代理在开发人员工具中警告这种用法，并尝试在发生时抛出InvalidAccessError异常。

为什么使用JS Promises而不是IF / ELSE / Ternary？

2 个答案: