Javascript/JQuery/Output 使用 JQUERY.get 调用端点时，promise 和 await 之间的输出不同

Question

我正在使用 JQuery 和 promises 从模拟端点获取一些模拟数据。

只是为了它，我想尝试让它与 async/await 一起工作。

我想我设法找到了一些有效的代码，尽管我在控制台中没有得到相同的输出（在 chrome 浏览器中）。

这是两段代码：

import $ from 'jquery';

let myPromise = $.get("http://5e2f41529c29c900145db22d.mockapi.io/test/users");

myPromise
    .then(
        (data) => {
            console.log('Success promises: ', data);
        }
    )
    .catch(
        (error) => {
            console.log('Error : ', error.responseText);
        }
    );

和

// same as above but with async/await

import $ from 'jquery';


let getUsersFromEndPoint = async function (){
    try {
        let users = await $.get("http://5e2f41529c29c900145db22d.mockapi.io/test/users");
        console.log('Success Async: ' + users);
    } catch (error) {
        console.log('Error : ', error.responseText);
    }
};

getUsersFromEndPoint();

他们输出：

我不确定有什么区别。有谁知道为什么我得到不同的输出？以及他们俩 "mean" ?

谢谢！

Answer 1

基于 promise 的代码和 async/await 都是正确的，并且做同样的事情，除了一个小的（因此难以发现）差异。

基于 promise 版本的记录器代码：

console.log('Success promises: ', data);

...按您的预期记录结果。

但是，在异步函数中，console.log 包含一个 + 运算符，它将其第二个操作数（数据）转换为字符串，因此所有对象都转换为 "[object Object]":

console.log('Success Async: ' + users);

将数据作为 console.log 的第二个参数传递（就像您对 promise 版本所做的那样），您将获得预期的结果。

Javascript/JQuery/Output 使用 JQUERY.get 调用端点时，promise 和 await 之间的输出不同

Javascript/JQuery/Output Different output between promise and await when calling endpoint using JQUERY.get

javascript

jquery

async-await

ecmascript-6

es6-promise