Javascript 字符串化返回对象？

我的.js文件中有以下内容

api.rooms = class {
    static get url() {
    return "http://127.0.0.1:8080/api/rooms/";
  }

  static getRooms() {
       return $.ajax({
       url: api.rooms.url,
       method: "GET",
       dataType: "json",
       timeout: api.timeout,
       }).then(function(data) {
           return data.rooms.map(item => item.name)[0]; //Works OK!
        });   
  }
}

$(document).ready(function() {
    $("#title").text(api.rooms.getRooms().done(function(data) {
        console.log(JSON.stringify(data));
    }).fail(function(jqXHR, textStatus, errorThrown) {
        console.log("Request failed: jqXHR.status=" + jqXHR.status + ",                 
       textStatus=" + textStatus + ", errorThrown=" + errorThrown);
    }))
});

现在getRooms（）似乎工作正常，当我测试整个代码时，控制台会打印出它应该打印的内容。但是我想获取控制台中打印的内容，而不是在控制台中打印，用“title”id替换“h3”元素中的文本结果表明，id为'title'且标记为'h3'的元素最终得到的文本是[object object]，而不是我想要的文本。

---

我怎样才能解决这个问题？谢谢

看来您偶然发现了Javascript最有趣的一点：回调函数！不幸的是，正如您所发现的，

api.rooms.getRooms（）.done

（或者实际上，

.done（）.fail

）的实际返回值没有那么有用。也许你的意思是：

$(document).ready(function() {
    api.rooms.getRooms().done(function(data) {
        var rooms = JSON.stringify(data);
        console.log(rooms);
        $("#title").text(rooms); // <<< sets the DOM element <<<
    }).fail(function(jqXHR, textStatus, errorThrown) {
        console.log("Request failed: jqXHR.status=" + jqXHR.status + ",                 
       textStatus=" + textStatus + ", errorThrown=" + errorThrown);
    });
});

这是JS中非常常见的样式。网络请求需要很长时间，在等待请求完成时，我们可能需要做其他事情。解决方案是传入一个

函数（data）

，一旦

数据

就绪，它将告诉JS该做什么。这些函数的实际返回值没有使用，也不重要。1

这是异步编程的一部分：而不是使用

返回室

在

回调

函数的末尾，我们调用另一个函数，如

$（“#title”）.text（rooms）在数据返回后实际执行某项操作

深入
有关继续传递样式（我在这里使用）的更多示例，以及有关回调地狱的信息和避免回调地狱的方法，这些文章可能会为您指出新的学习方向：






1使用返回值的一个位置是挂起
.done（）
和
.fail（）
调用的方便位置。这就是您看到的
[object object]
。一旦分配了done和fail回调，就再也不需要该对象了

从理论上讲，该对象不是延续传递样式的基本部分，也不是每个库都以这种方式工作。它只允许您链接
.done（）
和
.fail（）
调用（也返回用于链接的对象），并使代码看起来漂亮。设计者还可以将done和fail回调参数用于请求，这在代数上更简单，但在实践中更难阅读：

api.rooms.getRooms(function done(data) {...}, function fail(...) {...})

看起来您偶然发现了关于Javascript最有趣的事情之一：回调函数！不幸的是，正如您所发现的，
api.rooms.getRooms（）.done
（或者实际上，
.done（）.fail
）的实际返回值没有那么有用。也许你的意思是：

$(document).ready(function() {
    api.rooms.getRooms().done(function(data) {
        var rooms = JSON.stringify(data);
        console.log(rooms);
        $("#title").text(rooms); // <<< sets the DOM element <<<
    }).fail(function(jqXHR, textStatus, errorThrown) {
        console.log("Request failed: jqXHR.status=" + jqXHR.status + ",                 
       textStatus=" + textStatus + ", errorThrown=" + errorThrown);
    });
});

这是JS中非常常见的样式。网络请求需要很长时间，在等待请求完成时，我们可能需要做其他事情。解决方案是传入一个
函数（data）
，一旦
数据
就绪，它将告诉JS该做什么。这些函数的实际返回值没有使用，也不重要。1

这是异步编程的一部分：而不是使用
返回室
在
回调
函数的末尾，我们调用另一个函数，如
$（“#title”）.text（rooms）在数据返回后实际执行某项操作

深入
有关继续传递样式（我在这里使用）的更多示例，以及有关回调地狱的信息和避免回调地狱的方法，这些文章可能会为您指出新的学习方向：






1使用返回值的一个位置是挂起
.done（）
和
.fail（）
调用的方便位置。这就是您看到的
[object object]
。一旦分配了done和fail回调，就再也不需要该对象了

从理论上讲，该对象不是延续传递样式的基本部分，也不是每个库都以这种方式工作。它只允许您链接
.done（）
和
.fail（）
调用（也返回用于链接的对象），并使代码看起来漂亮。设计者还可以将done和fail回调参数用于请求，这在代数上更简单，但在实践中更难阅读：

api.rooms.getRooms(function done(data) {...}, function fail(...) {...})

您需要说明要打印的对象的属性。Stringify将对象的内容转换为字符串。所以，如果你想要你的所有权，那么做一些类似的事情

$('#my_h3').text( data.title );

您需要说明要打印的对象的属性。Stringify将对象的内容转换为字符串。所以，如果你想要你的所有权，那么做一些类似的事情

$('#my_h3').text( data.title );

结果

api.rooms.getRooms().done(function(data) {
    console.log(JSON.stringify(data));
}).fail(function(jqXHR, textStatus, errorThrown) {
    console.log("Request failed: jqXHR.status=" + jqXHR.status + ",                 
   textStatus=" + textStatus + ", errorThrown=" + errorThrown);
})

是jQuery对象

因此，您的代码相当于

$("#title").text({})

此处的任何对象都将导致标题内容
[object object]

异步不能是快捷方式。。。你需要做一些类似的事情

$(document).ready(function() {
    api.rooms.getRooms().done(function(data) {
        $("#title").text(JSON.stringify(data));
    }).fail(function(jqXHR, textStatus, errorThrown) {
        console.log("Request failed: jqXHR.status=" + jqXHR.status + ",                 
       textStatus=" + textStatus + ", errorThrown=" + errorThrown);
    }))
});

相反
的结果

api.rooms.getRooms().done(function(data) {
    console.log(JSON.stringify(data));
}).fail(function(jqXHR, textStatus, errorThrown) {
    console.log("Request failed: jqXHR.status=" + jqXHR.status + ",                 
   textStatus=" + textStatus + ", errorThrown=" + errorThrown);
})

是jQuery对象

因此，您的代码相当于

$("#title").text({})

此处的任何对象都将导致标题内容
[object object]

异步不能是快捷方式。。。你需要做一些类似的事情

$(document).ready(function() {
    api.rooms.getRooms().done(function(data) {
        $("#title").text(JSON.stringify(data));
    }).fail(function(jqXHR, textStatus, errorThrown) {
        console.log("Request failed: jqXHR.status=" + jqXHR.status + ",                 
       textStatus=" + textStatus + ", errorThrown=" + errorThrown);
    }))
});

相反
对象的默认字符串表示形式是
“[object object]”
。您必须访问要显示的属性
您希望在HTML中打印问题是，
api.rooms.getRooms（）.done（…
返回一个jQuery对象，而不是您所期望的数据…因此这就像运行
$（“#title”）。text（{}）
对象的默认字符串表示形式是
“[object object]”
。您必须访问要显示的属性。您正在谈论此语句
console.log（JSON.stringify（data））；
您希望在HTML中打印问题是，
api.rooms.getRooms（）.done（。