Question

我目前正在使用Petfinder的api构建一个辅助项目以学习Node。

问题在于，Petfinder的api有时会为我可能要在页面上显示的特定字段返回一个空对象。到目前为止，在生成HTML时，我一直在检查是否存在非空对象，例如：

<img class="pet-image" src="${Object.keys(pet.media).length !== 0 ? pet.media.photos.photo[3].$t : ""}">

但是这段代码很难看，我知道不应该在这里完成。另外，总是必须对API响应中的非必需字段执行此操作会很麻烦。如何处理此问题有什么策略？

Answer 1

如何处理呢？

有_.get之类的工具（来自lodash），可以让您在路径中获取对象的属性并将其自动化-但是，通常，让您不确定类型的对象并不是一个好方法代码。

最常见也是我最喜欢的策略是将对象转换为调用站点上您熟悉的表单（当请求到达时）：

const someWeirdAPI = await fetch('./endpoint').then(x => x.json());
const result = {
  cake: someWeirdAPI.cake || "Default Cake",
  pets: someWeirdAPI.pets || [] // or some other default
  // ... etc
};

那样，您知道当您在代码中获得对象时，它始终是有效的-在API数据传输对象和域层对象（您的逻辑）之间进行转换时，您还可以添加属性。

在呈现到页面之前，如何处理API响应中的空对象？

1 个答案: