使用Express作为后端程序,
通过JSON编码后返回数据:
const data = JSON.stringify(originData)
res.send(`${data}`);
前端在接受到之后:
useEffect(() => {
console.log(111)
axios.get('http://localhost:3000/blocks/1').then((res) => {
console.log(JSON.stringify(res.data.results)) // 这里有数据
const blocksRes = res.data.results
console.log(typeof blocksRes) // 打印的是:object
setBlocks(res.data.results)
})
}, [])
这里有一个疑问,
1、后端返回JSON编码后的数据,在前端axios接受之后,就是转为了JavaScript对应的对象是吗?
2、这里打印的是一个数组样式的数据:
console.log(JSON.stringify(res.data.results))
结果:
[{"object":"block","id":"17ddeaa8-cb4b-803e-9807-e9197656cee6","parent":{"type":"page_id","page_id":"17ddeaa8-cb4b-8092-9a2c-c1617a013cdd"},"created_time":"2025-01-16T10:35:00.000Z","last_edited_time":"2025-02-07T07:06:00.000Z","createdUser":{"object":"user","id":"4dbd-acb7-6d3fd574055822"},"last_edited_by":{"object":"user","id":"4dbd-acb7-6d3fd574055822"},"has_children":false,"archived":false,"Rrash":false,"type":"paragraph","paragraph":{"rich_text":[{"type":"text","text":{"content":"11","link":null},"annotations":{"bold":false,"italic":false,"strikethrough":false,"underline":false,"code":false,"color":"default"},"plain_text":"11","href":null}],"color":"default"}},{"object":"block","id":"193deaa8-cb4b-807c-907d-c36955a9904f","parent":{"type":"page_id","page_id":"17ddeaa8-cb4b-8092-9a2c-c1617a013cdd"},"created_time":"2025-02-07T07:06:00.000Z","last_edited_time":"2025-02-07T08:54:00.000Z","createdUser":{"object":"user","id":"4dbd-acb7-6d3fd574055822"},"last_edited_by":{"object":"user","id":"4dbd-acb7-6d3fd574055822"},"has_children":false,"archived":false,"Rrash":false,"type":"paragraph","paragraph":{"rich_text":[{"type":"text","text":{"content":"22","link":null},"annotations":{"bold":false,"italic":false,"strikethrough":false,"underline":false,"code":false,"color":"default"},"plain_text":"22","href":null}],"color":"default"}},{"object":"block","id":"193deaa8-cb4b-8019-9543-f2a38aa45c23","parent":{"type":"page_id","page_id":"17ddeaa8-cb4b-8092-9a2c-c1617a013cdd"},"created_time":"2025-02-07T08:54:00.000Z","last_edited_time":"2025-02-07T08:54:00.000Z","createdUser":{"object":"user","id":"4dbd-acb7-6d3fd574055822"},"last_edited_by":{"object":"user","id":"4dbd-acb7-6d3fd574055822"},"has_children":false,"archived":false,"Rrash":false,"type":"paragraph","paragraph":{"rich_text":[],"color":"default"}},{"object":"block","id":"193deaa8-cb4b-80ee-833b-c63b0abe9395","parent":{"type":"page_id","page_id":"17ddeaa8-cb4b-8092-9a2c-c1617a013cdd"},"created_time":"2025-02-07T08:54:00.000Z","last_edited_time":"2025-02-07T08:55:00.000Z","createdUser":{"object":"user","id":"4dbd-acb7-6d3fd574055822"},"last_edited_by":{"object":"user","id":"4dbd-acb7-6d3fd574055822"},"has_children":false,"archived":false,"Rrash":false,"type":"code","code":{"caption":[],"rich_text":[{"type":"text","text":{"content":"{\n aaa: 111,\n bbb: 222,\n}","link":null},"annotations":{"bold":false,"italic":false,"strikethrough":false,"underline":false,"code":false,"color":"default"},"plain_text":"{\n aaa: 111,\n bbb: 222,\n}","href":null}],"language":"json"}},{"object":"block","id":"193deaa8-cb4b-8040-8014-ccf112c8b971","parent":{"type":"page_id","page_id":"17ddeaa8-cb4b-8092-9a2c-c1617a013cdd"},"created_time":"2025-02-07T08:55:00.000Z","last_edited_time":"2025-02-07T08:55:00.000Z","createdUser":{"object":"user","id":"4dbd-acb7-6d3fd574055822"},"last_edited_by":{"object":"user","id":"4dbd-acb7-6d3fd574055822"},"has_children":false,"archived":false,"Rrash":false,"type":"paragraph","paragraph":{"rich_text":[],"color":"default"}},{"object":"block","id":"193deaa8-cb4b-80d2-91d6-d950d3d73dc2","parent":{"type":"page_id","page_id":"17ddeaa8-cb4b-8092-9a2c-c1617a013cdd"},"created_time":"2025-02-07T08:55:00.000Z","last_edited_time":"2025-02-07T08:55:00.000Z","createdUser":{"object":"user","id":"4dbd-acb7-6d3fd574055822"},"last_edited_by":{"object":"user","id":"4dbd-acb7-6d3fd574055822"},"has_children":false,"archived":false,"Rrash":false,"type":"paragraph","paragraph":{"rich_text":[],"color":"default"}}]
这里看出是一个数组,为何:这里打印是object呢?
console.log(typeof blocksRes) // 打印的是:object
对于问题二,JavaScript的typeof 数组返回的就是object,可以用Array.isArray或者instanceof判断数组。